如何在 laravel 中使用 vue js 删除数据

Question

我想在我的 laravel 应用中使用 vue js 创建一个删除功能。

我在这里尝试

我的 .vue 代码

<tr v-for="(artist, index) in artists.data">
    <td>{{ artist.artist_name }}</td>
    <td>{{ artist.gender }}</td>
    <td>{{ artist.created_at }}</td>
    <td>{{ artist.updated_at }}</td>
    <td>Edit | <a href="javascript:;" v-on:click="deleteUser(artist.id, index)">Delete</a></td>

我的变量

data() {
    return {
        term:'',
        disabled: 0,
        artists: [],
        results: [],
        loading: false,
        noResults: false,
        SearchDiv: false,
        IndexDiv: true
    }
},

我的删除方法

deleteUser(id, index) {
    axios.delete('/api/artist/'+id)
    .then(resp => {
        this.artists.splice(index, 1);
    })
    .catch(error => {
        console.log(error);
    })
}

我得到的错误

TypeError: _this4.artists.splice 不是函数

上面的代码可以从数据库中删除数据，但不能从数组结果中删除数据。

Answer 1

您正在将数据拼接到其母数组。

试试这个。

this.artists.data.splice(index, 1);