Vue的基本原理
当一个Vue实例创建时，Vue会遍历data中的属性，用 Object.defineProperty（vue3.0使用proxy ）将这些属性转为 getter/setter，即访问或者改变的时候会调用对于的函数，并且在内部追踪相关依赖，在属性被访问和修改时通知变化。 每个组件实例都有相应的 watcher 程序实例，它会在组件渲染的过程中把属性记录为依赖（让组件的 Watcher 记住「这个组件渲染必须用到这个数据属性，以后这个数据变了，组件就得跟着更新」），之后当依赖项的setter被调用时，即数据改变了，会通知watcher重新计算，从而致使它关联的组件得以更新。
-----------来自于前端充电宝
在 Vue 中，依赖指的是：某个组件的渲染函数或计算属性，在运行过程中访问了哪些响应式数据属性。那Watcher 它的作用是：记录我在执行过程中，用到了哪些响应式属性。
总结起来就是，Vue 实例创建后，遍历 data 中的属性，通过Object.defineProperty将属性转为带有 getter/setter 的响应式属性；每一个组件实例对应一个 Watcher 程序实例，每一个数据属性对应一个 Dep 依赖管理器；在组件渲染时读取属性会触发 getter，Dep 会记录下关联的 Watcher（Watcher 也会记录使用到的属性）；当修改属性时触发 setter，setter 通知 Dep 依赖管理器，Dep 通知关联的 Watcher，Watcher 触发组件重新渲染更新页面。
步骤
- Vue 实例创建，遍历data
- defineProperty将data中属性转换为响应式属性
- 组件对应Watcher，数据对应Dep依赖管理器
- 渲染时读取属性，触发getter，dep记录watcher，watcher记录使用到的属性
- 修改时触发setter，setter 通知 Dep，Dep 通知关联的 Watcher，Watcher 触发组件重新渲染更新页面。
