1. 程式人生 > >vue v-for迴圈的用法

vue v-for迴圈的用法

1、v-for迴圈普通陣列

    ①建立vue物件

    ② 迴圈資料

    結果:

2、v-for迴圈物件陣列

    ① 建立vue例項物件

   ② 迴圈物件陣列

    結果:

3、v-for迴圈物件

    ①建立vue物件例項

    ②迴圈物件

    結果:

4、v-for迴圈數字

    ①建立vue物件例項

     ②迴圈數字

    結果:

5、v-for中key的使用方式

    ①建立vue物件例項

    注意:push()方法一般是新增到陣列的最後的位置;unshift()方法是往最前面的位置新增。

    ②迴圈

    注意:

  • v-for迴圈的時候,key屬性只能使用number或String。
  • key在使用的時候,必須使用v-bind屬性繫結的形式,指定key的值。
  • 在元件中使用v-for迴圈的時候,或者在一些特殊情況中,如果v-for有問題,必須在使用v-for的同時,指定唯一的 字串/數字 型別 :key值。

    結果: