dimanche 11 février 2018

Update list of components after deletion Vue Laravel

I am creating a SPA application with vue and learning the basics, using my table users create a component for this model

<template>
    <div class="card" style="width: 18rem;">

      <div class="card-body">
        <h5 class="card-title"> </h5>
        <p class="card-text"></p>
        <button class="btn btn-danger" @click="deleteUser(user.id)">Eliminar</button>
      </div>

    </div>
</template>

Inside this, I have a method that removes a user from the database

deleteUser: function(usuario){
        axios.post('deleteuser',{
            id: usuario
        })
        .then(function(response){
            console.log(response);
        });
    }

In my view I reenderizo the complete list

<usuario v-for="item in usuarios" :user="item"></usuario>

I filled the array in the following way 'to iterate with vue

data : function(){
    return {
        usuarios : []
    }
},
mounted(){
    let tx = this;
    axios.get('/users')

    .then(function(response){
        tx.usuarios = response.data;
    })
    .catch(function (error) {
        console.log(error);
    });
},

How can I do that after deleting the user, the list is renderedize by removing this component that was dropped?



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire