1.8.2 对象的 v-for
优质
小牛编辑
129浏览
2023-12-01
你也可以用v-for
通过一个对象的属性来迭代。
<ul id="v-for-object" class="demo"> <li v-for="value in object"> {{ value }} </li> </ul> new Vue({ el: '#v-for-object', data: { object: { firstName: 'John', lastName: 'Doe', age: 30 } } })
结果:
- {{ value }}
你也可以提供第二个的参数为键名:
<div v-for="(value, key) in object"> {{ key }}: {{ value }} </div>{{ key }}: {{ value }}
第三个参数为索引:
<div v-for="(value, key, index) in object"> {{ index }}. {{ key }}: {{ value }} </div>{{ index }}. {{ key }}: {{ value }}
在遍历对象时,是按Object.keys()
的结果遍历,但是不能保证它的结果在不同的 JavaScript 引擎下是一致的。