v-for 还支持一个可选的第二个参数，参数值为当前项的索引：

 

v-for 实例

 

index 为列表项的索引值：

 

<div id="app">

  <ol>

    <li v-for="(site, index) in sites">

      {{ index }} -{{ site.text }}

    </li>

  </ol>

</div>

<script>

const app = {

  data() {

    return {

      sites: [

        { text: 'Google' },

        { text: 'Runoob' },

        { text: 'Taobao' }

      ]

    }

  }

}

 

Vue.createApp(app).mount('#app')

</script>

 

 

模板 <template> 中使用 v-for：

 

v-for

<ul>

  <template v-for="site in sites">

    <li>{{ site.text }}</li>

    <li>--------------</li>

  </template>

</ul>