Question

在我的Laravel 5 / vuejs 2 / vuex应用程序中，我在db中删除了一行，并使用splice函数从数组中删除项，如下所示：

    axios({
        method: ( 'delete' ),
        url: this.getters.apiUrl + '/personal/hostel_bookmarks/' + this.getters.currentLoggedUser.id + "/" + relatedHostel.id,
    }).then((response) => {
        let L = this.getters.hostelBookmarks.length

        for (var I = 0; I < L; I++) {
            if (relatedHostel.id == this.getters.hostelBookmarks[I].hostel_id) {
                // this.getters.hostelBookmarks.splice(this.getters.hostelBookmarks.indexOf(this.getters.hostelBookmarks[I]), 1)                        
                this.getters.hostelBookmarks.splice(I, 1)
                context.commit('refreshHostelBookmarks', this.getters.hostelBookmarks);
                break;
            }
        }
        bus.$emit( 'onHostelBookmarkDeleteSuccess', response );
    }).catch((error) => {
        bus.$emit('onHostelBookmarkDeleteFailure', error);
    });

如果this.getters.hostelBookmarks具有更多1个元素，则工作正常，但如果只有1个元素，则不会删除它，而是js控制台中的错误...

如何解决？

Answer 1

这应该可以解决您的问题

let index = this.getters.hostelBookmarks.findIndex(item => { return item.hostel_id === relatedHostel.id })
if (index !== -1) {
  this.getters.hostelBookmarks.splice(index, 1)
  context.commit('refreshHostelBookmarks', this.getters.hostelBookmarks); 
}

Answer 2

您可以尝试以下代码吗？

let L = this.getters.hostelBookmarks.length;

for (var I = L-1; I >= 0; I--) {
    if (relatedHostel.id == this.getters.hostelBookmarks[I].hostel_id) {
        this.getters.hostelBookmarks.splice(I, 1);
        context.commit('refreshHostelBookmarks', this.getters.hostelBookmarks);
        break;
    }
}

用于++的演示代码--：如果您有数组[1、2、3、4、5]。并且您要删除第二和第四元素2和4。

第一个++：

const origin = [1,2,3,4,5];
for(var i = 0; i < origin.length; i++){
    if(i === 1 || i === 3) {
        origin.splice(i, 1);
    }
}
console.log(origin); // [1, 3, 4]

如您所见，结果并非预期。如果您记录循环中的每个元素，则会看到删除元素 2 后元素的索引已更改。实际上，当i在循环中为3时，第5个元素将被删除。

然后让我们看一下-：

const origin = [1,2,3,4,5];
for(var i = origin.length; i >= 0; i--){
    if(i === 3 || i === 1) {
        origin.splice(i, 1);
    }
}
console.log(origin); // [1, 3, 5]

这就是您想要的。当-时，我们将从最后一个元素中删除该元素。元素的索引不变。

拼接功能在1个项目的数组中无法正常工作

2 个答案: