Trying to implement a transition on a list using Vue and Vuetify, but encountering the error message
vue.runtime.esm.js?2b0e:619 [Vue warn]: <transition-group> children must be keyed: <v-card>I attempted the Vuetify approach
<v-fade-transition group tag="v-card">
<v-card v-for="(item, index) in usersData" :key="item.email" class="pa-5 my-7">
{{item}}, {{index}}
</v-card>
</v-fade-transition>
as well as the Vue method:
<transition-group name="list" tag="v-card">
<v-card v-for="(item, index) in usersData" :key="item.email" class="pa-5 my-7">
{{item}}, {{index}}
</v-card>
</transition-group>
However, both approaches still result in the same error. This leaves me wondering what exactly I should use as the key?