Need v-bind:key now for v-for

[cliffchristianson]

I got a linting error I think from the Vetur extension on Line 29 in App.vue in vscode <div class="mt-6 w-full px-4 lg:w-1/2 xl:w-1/3" v-for="destination in popularDestinations">

needs to become something like <div class="mt-6 w-full px-4 lg:w-1/2 xl:w-1/3" v-for="destination in popularDestinations" v-bind:key="destination">

or it throws a v-bind:key error for me

Not sure if this is a bug or intended from linting, but since vscode advises installing Vetur when it sees a .vue extension, others may have the same problem

[OlamiBounty]

your code should be

[cliffchristianson]

This is the App.vue in 01-getting-up-and-running/06-extracting-reusable-components

A better solution would be to add an id field to the records and then :key=destination.id

[OlamiBounty]

https://vuejs.org/v2/guide/list.html

[cliffchristianson]

Hey Olami, yeah the key isn't required in the docs so I'm assuming the linter is the culprit, React does the same thing nowadays. Although an easy fix, it broke my page which is why I raised the issue, would hate to see people new to Tailwind get discouraged by something like this.

Should I push my fix?