vue 数组渲染问题

vue 数组渲染问题

问题一： 用v-for循环渲染数组数据时，数据更新了，视图却没有更新

　　因为 JavaScript 的限制， Vue 不能检测如下变更的数组：
　　　　1. 当你利用索引直接设置一个项时，例如： vm.items[indexOfItem] = newValue
　　　　2. 当你修改数组的长度时，例如： vm.items.length = newLength

解决方法：

　　为了不第一种状况，如下两种方式将达到像 vm.items[indexOfItem] = newValue 的效果， 同时也将触发状态更新：

// Vue.set
Vue.set(example1.items, indexOfItem, newValue) （数组， 索引， 值）

// Array.prototype.splice`
example1.items.splice(indexOfItem, 1, newValue) （索引， 长度， 值）

　　避免第二种状况，使用 splice：

example1.items.splice(newLength)