how to remove an element from an array vue js


I have an array in the following way.

[ "icono-5-4", "icono-7-6", "icono-8-7", "icono-9-8", "icono-1-0", "icono-2-1" ]

I want to reactively remove an element: Know the name of the item until the user clicks on a button. Example, if the client clicks on a button and the button has the value icono-9-8

I would have to delete that element from my array

[ "icono-5-4", "icono-7-6", "icono-8-7", "icono-1-0", "icono-2-1" ]

and so on for this I use:

_.pull(this.array, 'icono-9-8');

but this is not reactive or it does not do it as fast as I want.

this.array.slice(id, 1)
asked by Alberto Ortega 29.11.2018 в 21:30

2 answers


I'm not sure what you're doing, I do not understand what _.pull(this.array, 'icono-9-8'); .

You can use splice() to remove an item better than slice() since you see the changes with splice() and modify the array instead of creating a new one.

new Vue({
  el: "#app",
  data: {
    lista: ["icono-5-4", "icono-7-6", "icono-8-7", "icono-9-8", "icono-1-0", "icono-2-1"]
  methods: {
    del: function() {
      var indice = this.lista.indexOf('icono-9-8');
      if (indice != -1)
        this.lista.splice(indice, 1);

<script src=""></script>
<div id="app">
    <li v-for="item in lista">
      {{ item }}
  <button @click="del">

answered by 30.11.2018 / 12:57

Hello, what if you try with array filter:

let arr = ["a", "b", "c", "d"]

let value = "b"

arr = arr.filter(function(item) {
  return item !== value

answered by 30.11.2018 в 03:24