在不同的vue版本,实现响应式的方法不同:
- vue2.0:Object.defineProperty
- vue3.0:Proxy
Vue 会遍历 data 所有的 property,并使用 Object.defineProperty 把这些 property 全部转为 getter/setter,每个组件实例都对应一个 watcher 实例,它会在组件渲染的过程中把“接触”过的数据 property 记录为依赖。之后当依赖项的 setter 触发时,会通知 watcher,从而使它关联的组件重新渲染。