数组循环:

<!-- item值 index下标  -->
<div id="app">
  <ol>
    <li v-for="(item,index) of arr">
      {{item}}
      {{index}}
      {{item.name}}
    <!-- item是arr下的对象,取对象下对应值  -->
    </li>
  </ol>
</div>

对象循环:

<!-- item属性值 key键名 index下标  -->
<div id="app">
  <ol>
    <li v-for="(item,key,index) of obj" :key="key">
      {{item}}
      {{key}}
      {{index}}

      <!-- item属性值是一个数组,可以再次循环(下面的key值可以跟上面的key值一样,只有在一个循环中没有相同的key就可以)-->
      <span v-for="innerItem of item" :key="innerItem.id">
        {{innerItem.name}}
      </span>

    </li>
  </ol>
</div>

 

Logo

前往低代码交流专区

更多推荐