Home > Software engineering >  Set an Pseude/autogenerated :key for v-for element vue.js
Set an Pseude/autogenerated :key for v-for element vue.js

Time:02-17

i need to set a pseude/autogenerated :key for v-for elements because the ids of the items could be duplicate.

i tried this:

<my-component v-for="items in item" v-bind:key="getPseudoIds()">

...

props:{
'id' : {
  default: 0,
  type: Number,
}

...

 getPseudeIds(){
   return this.id  ;
},

but i always get a

Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "id"

and if i declare id as data i get a infinite loop error

CodePudding user response:

is the key relevant? You could use the index as key

<my-component v-for="(item, index) in items" :key="index">

  • Related