[Vuejs]-Deleting object in Vue.js

by

2👍

You haven’t passed an index to your deleteQuestion method. Try this in your template instead:

<div class="question" v-for="(question, index) in questions">
  <h2>{{ question.question }}</h2>
  <button @click="deleteQuestion(index)" class="doprava">
    <img src="criss.png"/>
  </button>

etc.

However a better option might be to give each question an id property and delete it by filtering agains that id instead. This is because you can’t guarantee that the order/index of questions in the template will be consistent on each re-render. This could be done like so:

<button @click="deleteQuestion(question.id)">

Then in your method:

deleteQuestion(id) {
  this.questions = this.questions.filter(q => q.id !== id);
}

Leave a comment