27
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Elements in iteration expect to have 'v-bind:key' directivesと怒られる時

Posted at
<div v-for='(value, index) in values'>
    何かの記述
</div>

のように使う時、注意文が出たため、調べてみるとtrack-byに相当するものみたい。

Vue が各ノードの識別情報を追跡できるヒントを与えるために、また、先ほど説明したような**既存の要素の再利用と並び替えができるように、一意な key 属性を全てのアイテムに与える必要があります。**この特別な属性は 1.x の track-by に相当するものですが、しかしこれは属性のように動作します。従って、これを動的な値に束縛するためには v-bind を使う必要があります
リストレンダリング - key

なので、以下のように書くことを推奨する

<div v-for='(value, index) in values' :key='index'>
    何かの記述
</div>
27
14
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
27
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?