跳到主要内容

Vue 原理

在不同的vue版本,实现响应式的方法不同:

  • vue2.0:Object.defineProperty
  • vue3.0:Proxy

Object.defineProperty

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

Proxy

参考