vue列表渲染

v-for更新渲染过的元素列表，默认使用复用策略， 这个默认的模式是高效的，但是只适用于不依赖子组件状态或临时 DOM 状态 (例如：表单输入值) 的列表渲染输出

1 对象

迭代对象属性有三个参数，value, name, index

2 数组API

使用数组的变异方法改变数组触发视图更新；
使用非变异方法返回一个新数组来替换原数组时，不会丢弃现有DOM来重新渲染列表，用一个含有相同元素的数组去替换原来的数组是非常高效的操作

3 数组响应式

1）利用索引直接设置某一项，vue不能检测变动的数组；
2）修改数组长度也检测不到数组的变动；

针对第一种情况：
Vue.set(vm.items, indexOfItem, newValue) 同vm.$set()
vm.items.splice(indexOfItem, 1, newValue)

针对第二种情况：
vm.items.splice(newLength)

4 对象响应式

Vue也不能检测对象属性的添加或删除。
对于已创建的实例，vue不能动态添加根级别的响应式属性：
Vue.set(obj, propName, value) 同vm.$set()

为已有对象赋予多个新属性：合并对象

vm.userProfile = Object.assign({}, vm.userProfile, {
  age: 27,
  favoriteColor: 'Vue Green'
})

而不是

Object.assign(vm.userProfile, {
  age: 27,
  favoriteColor: 'Vue Green'
})

5 过滤、排序

显示一个数组的过滤或排序副本，而不实际改变或重置原始数据，可以创建返回过滤或排序数组的计算属性， 或者使用method方法