1. Vue2的响应式式原理主要是通过Object.defineProperty的方法里面的setter和getter方法的观察者模式来实现。也就是在组件的初始话阶段给每一个data属性都注册一个setter和getter,然后再new一个watcher对象,这个时候会立即调用组件里面的render函数去生成一个虚拟的DOM,然后再调用render的时候,就会需要用的data的属性值,此时就会触发getter函数,把当前的watcher函数注册到sub里面。当data属性发生了改变后,就会立即遍历sub里面的每个watcher对象,通知他们重新渲染组件
2. Vue3的响应式原理主要是通过Proxy(代理)+Reflect(反射)来实现的
通过 Proxy(代理) : 拦截对data任意属性的任意(13种)操作, 包括属性值的增删改查
通过 Reflect(反射): 动态对被代理对象的相应属性进行特定的操作
标签:Vue,watcher,响应,getter,组件,原理,data,属性 From: https://www.cnblogs.com/ltwlh/p/16859791.html