我们用 v-for 指令根据一组数组的选项列表进行渲染。v-for 指令需要使用 item in list 形式的特殊语法，list是源数据数组并且 item 是数组元素迭代的别名。

  基本用法  

html

  {
   {item}}

js

var app=new Vue({el:'#app',data:{list:['angular','react','vue',jquery]  }})

  对象循环输出  

我们经常需要在循环的时候元素是一个对象

html

    
       {
   {item.name}}--{
   {item.age}}
    

js

var app=new Vue({el:'#app',data:{list:[         {name:"mumu", age:18},         {name:"zql", age:22},         {name:"曾庆林", age:28},      ]  }})

  索引 

有时候我们需要知道当前循环元素的索引下标

    
       {
   {item.name}}-{
   {index}}-{
   {item.age}}
    

 结果是

mumu-0-18
zql-0-22
曾庆林-0-28

  key  

为了给 Vue 一个提示，以便它能跟踪每个节点的身份，从而重用和重新排序现有元素，你需要为每项提供一个唯一 key 属性。理想的 key 值是每项都有的唯一 id。

    {
   {item}} 

var app=new Vue({el:'#app',data:{items:['mumu','曾庆林','木木','mumu']  }})

 如果不绑定tip 重复的'元素' 再列表循环在列表循环会警告