从状态生成DOM到用户页面的显示这一整个流程被称为渲染,应用在运行时会不断地重新渲染,响应式系统通过变化侦测来为重新渲染的赋能。
变化侦测即侦测数据的变化,数据变化时会通知视图进行页面的更新。
Object的变化侦测
vue引入虚拟DOM,一个状态所绑定的依赖不再是具体的DOM节点,而是一个组件,状态变化后,会通知到组件组件内部在使用虚拟DOM进行比对。而如何追踪变化呢?
vue2.0版本目前使用的是Object.defineProperty来侦测到变化。
每个组件实例都对应一个 watcher 实例,它会在组件渲染的过程中把“接触”过的数据 property 记录为依赖。之后当依赖项的 setter 触发时,会通知 watcher,从而使它关联的组件重新渲染。
只要侦测到变化,vue将开启一个队列并缓冲在同一时间循环中发生的所有数据变更。如果同一个watcher被多次触发,只会被推入到队列中一次。
网友评论