vue的数据监听与劫持(数据已更新但视图未更新的情况)
根据vue的源码可知,vue会对data里面定义的对象一一递归进行数据监听与劫持,为每个属性都添加setter和getter方法,当监听到当前属性发生变化的时候,就调用这两个方法,从而实现双向绑定。那么未被定义的属性以及后续动态添加的属性,是不会被监听的,就会造成数据已发生变化,但视图没有更新的情况
而根据我们的编码习惯,我们通常会在打开弹窗的时候,对整个temp进行重新的赋值,而不是只对temp里面的某个属性单独做修改,那么举个例子
data(){
return {
temp:{name:'zhangsan',age:1}
}
}
//打开弹窗后,用当前row的表单数据整个替换this.temp
openEdit(row){
this.temp = row
}
假设我们getList的时候,获取到的当前行数据,只有{name:'zhangsan'}而没有age属性,我们这时候把这行数据直接整个赋值给temp,那么temp里面也就没有了age属性,则后续再用this.temp.age=xxx就会发生数据已修改,但视图
版权声明:
作者:zhangchen
链接:https://www.techfm.club/p/22435.html
来源:TechFM
文章版权归作者所有,未经允许请勿转载。
THE END
二维码
共有 0 条评论