vue中v-for对象数组
时间: 2024-01-20 21:17:03 浏览: 124
vue.js基于v-for实现批量渲染 Json数组对象列表数据示例
在Vue中,可以使用v-for指令来遍历对象数组。下面是一个示例:
```html
<ul>
<li v-for="item in items" :key="item.id">
{{ item.name }}
</li>
</ul>
```
在上面的示例中,我们使用v-for指令来遍历名为items的对象数组。每个数组项都会被渲染为一个li元素,并显示item.name的值。需要注意的是,我们还为每个li元素提供了一个唯一的key属性,以便Vue能够跟踪每个元素的身份。
如果你想在遍历过程中获取索引值,可以使用以下语法:
```html
<ul>
<li v-for="(item, index) in items" :key="item.id">
{{ index + 1 }}. {{ item.name }}
</li>
</ul>
```
在上面的示例中,我们使用(index + 1)来显示索引值,并将其与item.name一起显示在li元素中。
阅读全文