由于 JavaScript 的限制,Vue 不能检测以下变动的数组:
当利用索引直接设置数组的某一项时,例如:vm.items[indexOfItem] = newValue
当你修改数组的长度时,例如:vm.items.length = newLength,不会更新数组。
当然vue中给了解决方法,就是使用 Vue.set, vm.$set(Vue.set的变种写法)或者 splice,concat等修改数组,同时也将触发状态更新。
单纯的赋值 会导致加减失效 要用$set
注意:this.$set( target, key, value )
target:要更改的数据源(可以是对象或者数组)
key:要更改的具体数据
value :重新赋的值。
控制台打印的数据更新了,但是页面视图却没有更新。这时候我们就需要用到this.$set()来更新视图了。