原因:因为 Vue.js 在初始化实例时将属性转为 getter/setter,所以属性必须在 data 对象上才能让 Vue.js 转换它,才能让它是响应的。以及一些深层的数组操作VUE监测不到数据变化。
splice: arr.splice(index, 1, newValue); //数组操作引发更新
this.$set(obj,obj.name,value) //对已存在的对象属性更新视图
this.$set(obj,'key',value) //给对象新增单个属性并更新视图
this.user = Object.assign( {}, this.user, { //给对象新增多个属性并更新视图
tel: 18888888888,
sex: 'Y'
})
(以上都能引发视图更新)
Vue.$set之前一定要对象内key不存在 不然只会更新值 并不会为该Key添加响应监测
(Vue 2.5版本已经更正了这个问题。实测对已经存在的key也可以添加响应监测)
参考:https://blog.csdn.net/kyoog/article/details/82661216
vue this.$set 给data对象新增属性,并触发视图更新
参考:https://blog.csdn.net/zhaoyangguang021/article/details/80999919