v-for
- 预期:
Array | Object | number | string | Iterable
- 用法:基于源数据多次渲染元素或模板块。此指令之值,必须使用特定语法
alias in expression
,为当前遍历的元素提供别名:
<div v-for="item in items"> {{ item.text }} </div>
另外也可以为数组索引指定别名(或者用于对象的键):
<div v-for="(item, index) in items"></div> <div v-for="(value, key) in object"></div> <div v-for="(value, name, index) in object"></div>
v-for
的默认行为会尝试原地修改元素而不是移动它们。要强制其重新排序元素,你需要用特殊 attribute key
来提供一个排序提示:
<div v-for="item in items" :key="item.id"> {{ item.text }} </div>
v-for
也可以在实现了可迭代协议的值上使用,包括原生的Map
和Set
。