遍历数组
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插入到模板中。