Javascript 使用本机从数组中删除对象元素
我正在尝试从数组中添加和删除对象,我已经能够找出添加对象部分,但删除不起作用。我使用过filter(),但它没有任何作用。现在我使用的是splice,它可以工作,但它会删除第一个元素,而不是选定的项目。下面是一个示例代码,为了更清晰,我只展示了这些函数Javascript 使用本机从数组中删除对象元素,javascript,arrays,json,reactjs,react-native,Javascript,Arrays,Json,Reactjs,React Native,我正在尝试从数组中添加和删除对象,我已经能够找出添加对象部分,但删除不起作用。我使用过filter(),但它没有任何作用。现在我使用的是splice,它可以工作,但它会删除第一个元素,而不是选定的项目。下面是一个示例代码,为了更清晰,我只展示了这些函数 handleDelete(item) { this.setState(({ list}) => { const newList = [...list];
handleDelete(item) {
this.setState(({ list}) => {
const newList = [...list];
newList.splice(item.key, 1);
console.log('deleted', newList);
return { list: newList };
});
}
handleAdd() {
const { firstname, lastname, email, phone} = this.state;
const ID = uuid();
const newItemObject = {
key: ID,
firstname: firstname,
lastname: lastname,
email: email,
phone: phone,
image: null,
};
this.setState(prevState => ({
list: [...prevState.list, newItemObject]
}));
}
我想该项在数组中的键和索引可能不相同。如果项目在数组中,则可以使用
array.indexOf()
查找其索引,并将其拼接出来:
handleDelete(item) {
this.setState(({ list }) => {
const newList = [...list];
const index = newList.indexOf(item);
newList.splice(index, 1);
return {
list: newList
};
});
}
或者,如果要使用Array.filter()
,请检查当前元素(o
)的键是否与项的键不同:
handleDelete(item) {
this.setState(({ list }) => ({
list: list.filter(o => o.key !== item.key)
}))
}
非常感谢,两种方法都有效。但使用哪种方法更好呢?filter方法更短、更简洁,并且不会创建另一个冗余数组(从切片中删除的项)。我会使用filter.have另一个问题,但我不知道在不同的问题下问另一个问题是否合适。这些评论用于讨论特定的问题/答案。创建一个新问题。