VUE3响应式

1.vue2的响应式

3和2的响应式原理不同，既然3修改了实现响应式的方法，那2的响应式的肯定是有缺陷的。所以需要先了解一下2的响应式：

Vue2官方网站对响应式的解释

主要的思想在于：

• 2的响应式主要实现由Object.defineProperty实现，当你把一个普通的 JavaScript 对象传入 Vue 实例作为 data 选项，Vue 将遍历此对象所有的 property，并使用 Object.defineProperty 把这些 property 全部转为 getter/setter。

• Vue无法检测property的添加或者移除。（可以使用Vue.set()方法添加响应式property）

• Vue只能通过监测数组API的执行来实现响应式

2.vue3的响应式

3的响应式通过Proxy实现。具体的解释可以见官网。这里给一个简单的实例:

vue2的get/set方法

Object.defineProperty(data,'count',{
  get(){},
  set(){},
})

vue3的Proxy：

new Proxy(data,{
  get(key){},
  set(key,value){}
})

 待补充