对数组和对象进行操作,没有被vue监听到没有实时更新,如何操作让vue监听动态变化
一、什么操作会导致vue监听不到
1、对象的变化
受现代 JavaScript 的限制(以及废弃 Object.observe),Vue 不能检测到对象属性的添加或删除。由于Vue 会在初始化实例时对属性执行 getter/setter 转化过程,所以属性必须在 data 对象上存在才能让 Vue 转换它,这样才能让它是响应的
使用Object.assign() 或 _.extend() 方法来添加属性
Object.assign({},{name:''123'})
1、数组的变化
由于 JavaScript 的限制, Vue 不能检测以下变动的数组:
(1)、当你利用索引直接设置一个项时,例如: vm.items[indexOfItem] = newValue
(2)、当你修改数组的长度时,例如: vm.items.length = newLength
使用Vue.set 或 splice方法来添加属性
this.$set
arr.splice(0,1,'123')
// 第一个参数是删除元素的下标,
//第二个参数是删除个数(可以为0),
//第三个是插入的元素