什么情况下会出现这个问题
- 问题一:当利用索引直接设置一个数组项时,例如:
vm.items [indexOfItem] = newValue - 问题二:当修改数组的长度时,例如:
vm.items.length = newLength
解决
1. 强制刷新页面
这种方式过于暴力,直接强制更新整个页面不推荐
this.$forceUpdate
2. 解决问题1
例如data中有个两个数据:
obj:{
key1: "value1",
key2: "value2",
key3: "value3"
},
list:["value1", "value2", "value3"]
参数意义:
target: 目标数据,例如: this.list ,this.obj
propertyName/index:目标数据中要更改那项的 属性名/索引,例如: key1 ,0
value:要更改的值,例如:value4
this.$set( target, propertyName/index, value );
this.$set( this.obj, 'key1', 'value4' )
// Vue.set
Vue.set(vm.items, indexOfItem, newValue)
// vm.$set,Vue.set的一个别名
vm.$set(vm.items, indexOfItem, newValue)
// Array.prototype.splice
vm.items.splice(indexOfItem, 1, newValue)
3. 解决问题2
// Array.prototype.splice
vm.items.splice(newLength)