v-for

一般情况：

　　　　1、v-for 用来遍历元素，一般情况用来遍历数组

　　　　2、可以遍历对象数组

用法注意：

　　　　1、使用v-for时候，一定要指定 ：key="

　　　　　　　　key的作用：唯一标识，key的参数不要使用数组的索引index，因为index会跟随for循环而改变

　　　　2、如果不指定唯一key，

 

1、遍历普通数组

<ul class="list-group">
      <li v-for="item in list">{{item}}</li>
</ul>

data: {

        text: '',

        list: ['Rose', 'Jack', 'Toney'],

        persons: [

          {id: 1, name: '老孙'},

          {id: 2, name: '小孙'},

          {id: 3, name: '老孙的小孙'}

        ]

      },

2、遍历数组，并加上序号

 <ul class="list-group">
      <li v-for="(item,index) in list" :key="item" >
        <input type="checkbox" >
        {{index + 1}} -- {{item}}
      </li>
    </ul>

3、遍历对象数组，并显示ID 和对象值

<ul class="list-group">
      <li v-for="item in persons" :key="item.id" >{{item.id}} -- {{item.name}}</li>
</ul>