遍历数组
Vue中最常用的遍历数组的方法就是使用v-for
指令。v-for
指令接受一个特殊的语法,(item,index) in array
,它会遍历array数组,每次返回一个当前遍历到的item项,以及它的索引index。例如:
- {{index}}:{{fruit}}
上面的代码中,fruits
是一个数组,v-for
指令会依次遍历这个数组,把每个数组元素赋值给fruit
,把当前索引赋值给index
,把fruit
和index
插入到模板中。
遍历对象
Vue中遍历对象的方法也是使用v-for
指令,但是要使用不同的语法,(value,key,index) in object
,它会遍历object对象,每次返回一个当前遍历到的value值,以及它的key和索引index。例如:
- {{index}}:{{key}}:{{value}}
上面的代码中,person
是一个对象,v-for
指令会依次遍历这个对象,把每个对象属性的值赋值给value
,把当前属性的key赋值给key
,以及当前索引赋值给index
,把value
、key
和index
插入到模板中。