在Vue3中，因为reactive创建的响应式对象是通过Proxy来实现的，所以传入数据不能为基础类型，所以 ref 对象是对reactive不支持的数据的一个补充。

最近一阶段在学习Vue3，Vue3中用 reactive、ref 等方法将数据转化为响应式数据，在获取时使用 track 往 effect 中收集依赖，在值改变时，使用 trigger 触发依赖，执行对应的监听函数，这次就先来看一下 reactive 的源码。

Map，Set，Date，Promise 等内置类型，都使用了所谓的"内部插槽"，类似于对象的私有属性，不允许外部访问，所以当代理没做处理时，直接代理他们会发生错误。

本篇文章通过一个栗子🌰来聊聊Vue初始化和更新数据的大致流程： {代码...} 很简单的例子，一个父组件一个子组件，子组件接受一个list，父组件有个按钮，可以往list里push数据改变list。初始化流程：首先从 new Vue({el: "#app"}) 开始，会执行 _init 方法。 {代码...} _init 方法的最后执行了 vm.$mount 挂载实...

于是想到之前用到过的一个裁剪图片的插件vue-cropper，一样是框选图片区域，于是学习了一下它的源码，并在此基础上自己实现了一个框选图片区域生成坐标的组件。

Vue中采用了 虚拟DOM + Diff算法 减少了对DOM的操作次数，大大提高了性能，那么我们今天就来详细的讲一下Vue中这一部分的实现逻辑，希望可以帮助还不理解这部分的小伙伴理解这一部分，纯手打，希望各位小伙伴点个赞支持一下！

Observer负责递归数据及所有子数据，通过Object.defineProperty为属性定义 getter/setter，监听数据的变化，将数据定义为响应式。但仅仅是把Object.defineProperty封装起来，监听数据的变化，是没有任何作用的，主要的目的是为了收集依赖。 {代码...}

观察者模式中通常有两个模型，一个观察者和一个被观察者。从字面意思上理解，即被观察者发生某些行为或者变化时，会通知观察者，观察者根据此行为或者变化做出处理。

遍历我们定义的computed属性，为每一个computed属性创建一个内部的监视器Watcher，保存在vm实例的_computedWatchers中，参数传递了一个lazy为true。

前言在前端开发中，localStorage的使用是非常多的，然而原生的localStorage有些功能是没有的，比如：无法设置每一个键的过期时间无法按模块管理localStorage一、如何使用先来看看如何使用的，再看实现方法：1、初始化时传入moduleName {代码...} 2、初始化时不传入moduleName {代码...} 获取时如果过期了，则会自动清空...

在我们日常开发vue或react项目时，多多少少会遇到这样的需求：我想在某个页面加载一个外部的资源文件，例如百度地图的js文件，还要在确保文件加载完成之后，执行一些逻辑。这些第三方文件，往往只在一个场景用到，并不想放在全局，这时候就需要实现一个文件的动态加载器。