v-for的四种使用方式

1、数组

<p v-for="(item,index) in arr">数值：{{item}}，索引：{{index}}</p>

2、在对象数组

objArr: [{
        id: 1,
        name: "Q"
    },
    {
        id: 2,
        name: "W"
    },
    {
        id: 3,
        name: "E"
    },
    {
        id: 4,
        name: "R"
    },
],

<p v-for="item in objArr">id:{{item.id}}--------name:{{item.name}}</p>

3、对象

对象不同于数组，遍历的大多数是关键字和值，即key和val，虽然对象也有索引值，但是一般都用不到。‘

obj: {
     id: "100",
     name: "qwer",
     sex: "male"
 }

<p v-for="(val,key,i) in obj">值：{{val}},键：{{key}}，索引：{{i}}</p>

4、迭代数字

迭代数字更加纯粹，看起来更像是为了循环而循环，不需要任何定义，直接在标签中使用，并且count是从1开始的。

<p v-for="count in 10">这是第{{count}}次循环</p>

v-for的四种使用方式没有优劣，主要看使用场景和需求选择。