How to remove an item from an array in Vue.js

Question

I am new to vue.js (2) and I am currently working on a simple event app. I\'ve managed to add events but now I would like to delete events based on clicking on a button.

Answer 1

You can delete item through id

Delete

Inside your JS code

deleteEvent(id){
  this.events = this.events.filter((e)=>e.id !== id )
}

Vue wraps an observed array’s mutation methods so they will also trigger view updates. Click here for more details.

You might think this will cause Vue to throw away the existing DOM and re-render the entire list - luckily, that is not the case.