como eliminar un elemento de un array vue js

publicado por: Anonymous

tengo un array de la siguiente manera.

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

Quiero eliminar reactivamente un elemento:
Sabre el nombre del elemento hasta que el usuario le de click a un botón. Ejemplo, si el cliente le da click un boton y el boton tiene el valor icono-9-8

tendria que borrar ese elemento de mi array

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

y asi sucesivamente para esto yo utilizo:

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

pero esto no estan reactivo o no lo hace tan rapido como quiero.

this.array.slice(id, 1)

solución

No sé muy bien que estás haciendo, no entiendo lo de _.pull(this.array, 'icono-9-8');.

Puedes usar splice() para eliminar un item mejor que slice() ya que vue observa los cambios con splice() y modifica el array en lugar de crear uno nuevo.

_x000D_

_x000D_

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

_x000D_

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>_x000D_
<div id="app">_x000D_
  <ul>_x000D_
    <li v-for="item in lista">_x000D_
      {{ item }}_x000D_
    </li>_x000D_
  </ul>_x000D_
  <button @click="del">_x000D_
  borrar_x000D_
  </button>_x000D_
_x000D_
</div>

_x000D_

_x000D_

_x000D_

Respondido por: user7176

Leave a Reply

Your email address will not be published. Required fields are marked *