vue中,当data里的数据改变时,会调用响应的set方法。
使用Object.defineProperty方法设置。大概原理如下:
let data = {
'name':'aaa',
'address':'xxxxx'
}
const obs = new Observer(data)
function Observer(obj) {
const keys = Ojbect.keys(obj)
keys.forEach((key)=>{
Object.defineProperty(this, key, {
get(){return obj[key]}
set(val){
//console.log('属性修改了,更新虚拟dom,对比,更新页面dom')
obj[key] = val
}
})
})
}