Question

<li v-for="(l, i) of lineList" :key="l._id"> 

data () {
        return {
            lineList: []
        }
    },
    methods: {
         query() {
            axios.get(domain + 'line')
                    .then((res) => {
                        this.lineList = res.data.data;
                    })
                    .catch((err) => {
                        console.log(err);
                    });
        },
        add() {
            axios.post(domain + 'line', {line: '432432'})
                    .then(res => {
                        this.lineList.unshift(res.data.data);
                    })
                    .catch(error => {
                        console.log(error);
                    });
        },
        remove(line, i) {
            axios.delete(domain + 'line/' + line._id)
                    .then(res => {
                        this.lineList.splice(i, 1);
                    })
                    .catch(err => {
                        console.log(error);
                    });
        }
    },

以上是我项目的代码片段。我使用的是最新版本的vue.js 2.

我的问题是，当我尝试执行此操作。删除此项后删除（），删除了错误的项目，我不知道为什么，有人有任何想法请告诉我，谢谢！

Answer 1

如果我是你，我会尝试以下方法：

remove(line) {
    axios.delete(domain + 'line/' + line._id)
    .then(res => {
        let index = this.lineList.indexOf(line)
        this.lineList.splice(index, 1);
    })
    .catch(err => {
        console.log(error);
    });
}

有了这个，您可以确定，由于let index = this.lineList.indexOf(line)

，您想要删除该项目的正确索引

Vue.js：添加新项目后从列表中删除项目导致错误

1 个答案: