1.数组更新检测
this.arr[3] = "aaa" // 不能触发视图更新
Vue.set(this.arr,3,'aaa') //可以触发视图更新
this.arr.splice(1,0,'ccc') //可以触发视图更新
this.arr.splice(1,1,'ccc') //可以触发视图更新
vm.$set(this.arr,3,'aaa') //可以触发视图更新
this.arr = [...this.arr,'sss']
2.对象更新检测
// 添加一个新属性
this.obj.color = 'green' // 不会引起视图更新(重新渲染)
Vue.set(this.obj,"color","green") //有用
vm.$set(this.obj,"color","green") //有用
this.$set(this.obj,"color","green") //有用
或者使用扩展运算符换成新的对象
this.obj = {新属性:值,..this.obj}
//修改属性
this.obj.name = 'John' //有用
// 删除属性
delete this.obj.age //不更新
this.$delete(对象,‘属性’) //更新视图
Vue.delete(对象,‘属性’) //更新视图
网友评论