vue v-for语法遍历

v-for除了可以迭代数组，也可以迭代对象。语法基本类似（:key=index一般和v-for一起使用）。

语法：

v-for="value in object"
v-for="(value,key) in object"
v-for="(value,key,index) in object"

1个参数时，得到的是对象的属性值
2个参数时，第一个是属性值，第二个是属性名
3个参数时，第三个是索引，从0开始

示例：

<div id="app">
    <ul>
        <li v-for="(value, key, index) in user" :key=index>
            {
   
   {index + 1}}. {
   
   {key}} - {
   
   {value}}
        </li>
    </ul>
</div>
<script src="./node_modules/vue/dist/vue.js"></script>
<script type="text/javascript">
    var vm = new Vue({
        el:"#app",
        data:{
            user:{name:'名字', sex:'性别', age: 20}
        }
    })
</script>

遍历数组

语法：
v-for="item in items"
items：要遍历的数组，需要在vue的data中定义好。
item：迭代得到的数组元素的别名

数组角标
在遍历的过程中，如果我们需要知道数组角标，可以指定第二个参数：
语法
v-for="(item,index) in items"
items：要迭代的数组
item：迭代得到的数组元素别名
index：迭代到的当前元素索引，从0开始。
示例

<ul>
    <li v-for="(p, index) in person">
        {
   
   {index + 1}}. {
   
   {p.name}} - {
   
   {p.gender}} - {
   
   {p.age}}
    </li>
</ul>