day189-MyVue-完善Observer

要点

  1. 从Vue.js中入手,先完善new Obersver(this._data)

Obersver

/**
* 观察者,需要观察到的实例属性,通过set、get把数据发布者订阅者绑定在一起
*/
import Dep from './Dep'

class Observer {
constructor (data) {
this.data = data
Object.keys(this.data).forEach(key => {
this._bind(data, key, data[key])
})
}
_bind(data, key, val) {
var myDep = new Dep()
// 逐个改掉
Object.defineProperty(data, key, {
get () {
if (Dep.target) myDep.listen(Dep.target)
return val
},
set (newVal) {
if (val === newVal) return
val = newVal
myDep.notify()
}
})
}

}

export default Observer
文章作者: lmislm
文章链接: http://lmislm.com/2019/07/21/2019-07-21/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 LMISLMのBlog