Console warning: component lists rendered with v-for should have explicit keys

The answer is listed explicitly in the documentation you linked…

<todo-item v-for="todoItem in todos"
           v-bind:data="todoItem"
           v-bind:key="todoItem.text"></todo-item>

To summarise some information from the comments below… you use :key to let the component know how to identify individual elements. This allows it to keep track of changes for Vue’s reactivity.

It’s best to try and bind the :key to some uniquely identifying property of each item. For example, an id.

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)