[Vuejs]-Vue.js—V-model in v-for current object

by

0👍

✅

The only thing you need to to is to add titre before your definition(s).

TEMPLATE:

...
  <button @click="ajouter()">Ajouter</button>
...
  <div v-for="(titre,index) in titres" :key="titre.id">
    <input v-model="titre.titremodify">
  </div>
...

SCRIPT:

data() {
  return {
    titres: [{    //this is your first input
      id: 1,
    }]
    titremodify: "", 
  }
}

methods: {
  ajouter: function(){   
    this.titres.push({
      id: this.id +=1
    }); 
  },
}

For every titres in your v-for you create a titre with a unique ID (this will help you out in future matters). So you just have to reference on this like above.

This should solve your problem.

Leave a comment