vue.js中响应式原理

103 阅读1分钟

watcher监听

我们首先了解Watch的作用

  1. 作用:
    用来监听数据的变换, 当数据模型 (data选项 M)发生改变时, watch就会触发
  2. 使用
    两种用法:1.key的值是一个函数,2.key的值是一个对象

响应式原理:

Vue通过watcher将data中的属性全部使用Object.definePropery中的getter和setter,当属性值发生
改变的时候, 就会触发, 然后wather就会触发, 告诉视图(V)进行重新渲染

深入响应式原理是利用了数据劫持和订阅发布的模式, 当数据模型发生改变的时候, 视图就会响应的进行更新, 那么深入响应式原理是利用es5的Object.defineProperty中个getter/setter来进行数据的劫持的

什么叫数据劫持?
数据劫持: Object.defineProperty中的getter/setter , 数据改变就执行watcher