介绍
用 v-for 把一个数组对应为页面上的一组元素
vue.js 使用的是 v-for 指令来处理组件元素的循环迭代逻辑。通常它会和 v-if 配合使用，达到我们所需要的处理逻辑。
v-for 的语法形式是 item in items，其中 items 就是我们要循环的数组，而 item 则是被迭代的数组元素的别名。
<ul id="example-1">
<li v-for="item in items">
{{ item.message }}
</li>
</ul>我们都知道既然有循环那肯定少不了对索引的处理。v-for 指令给我们提供了可选的第二个参数，即当前项的索引。
<ul id="example-2">
<li v-for="(item, index) in items">
{{ parentMessage }} - {{ index }} - {{ item.message }}
</li>
</ul>index 就是那个当前索引了。
你也可以使用 of 替代 in 作为分隔符。
<div v-for="item of items"></div>在 v-for 里使用对象
是哒，很明显 v-for 也可以用来遍历一个对象的属性。
<ul id="v-for-object" class="demo">
<li v-for="value in object">
{{ value }}
</li>
</ul>也可以提供第二个参数为 property 名称 (也就是键名)
<div v-for="(value, name) in object">
{{ name }}: {{ value }}
</div>还可以用第三个参数作为索引
<div v-for="(value, name, index) in object">
{{ index }}. {{ name }}: {{ value }}
</div>维护状态
敲黑板啦哈~
vuejs 为了维护循环列表的状态需要提供唯一的 key 属性。
这个唯一的 key 可以为我们提供列表元素状态的更新，避免重复渲染等优化页面的性能。
这个 key 很关键，并不推荐使用简单的索引作为 key 的值，因为会有造成重复渲染混乱的可能。
数组更新检测
咳咳～ 继续敲黑板
我们在写程序的时候，往往会有数据更新但是页面元素没有跟着对应变化的情况。
数组列表的更新检测 vue 为我们提供了一套解决方案，但是需要注意它们在使用的方式上是不同的。
变异方法
意思就是以下的数组处理方法可以触发视图上的更新。
push()
pop()
shift()
unshift()
splice()
sort()
reverse()需要注意的是它们处理的都是原始数组。也就是在原来的数组上增加删除或者排序操作。
非变异方法
