使用拼接反应本机从数组中删除对象元素

Posted 2023-02-22

【中文标题】使用拼接反应本机从数组中删除对象元素

【英文标题】：deleting object elements from array using splice react native

【发布时间】：2020-03-25 15:05:20

【问题描述】：

我正在尝试从数组中添加和删除一个对象，我已经能够找出添加对象部分，但删除不起作用。我使用了 filter() 但它什么也没做。现在我正在使用拼接，它可以工作，但它删除了第一个元素，而不是选定的项目。下面是一个示例代码，为了更清楚，我只展示了函数。

        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]
          ));
        

我愿意

【参考方案1】：

数组中项的键和索引可能不一样。如果item在数组中，可以使用Array.indexOf()找到它的索引，拼接出来：

handleDelete(item) 
  this.setState(( list ) => 
    const newList = [...list];
    const index = newList.indexOf(item);
    newList.splice(index, 1);

    return 
      list: newList
    ;
  );

或者如果你想使用Array.filter()，检查当前元素的key（o）和item的key是否不同：

handleDelete(item) 
  this.setState(( list ) => (
    list: list.filter(o => o.key !== item.key)
  ))

【讨论】：

非常感谢，两种方法都有效。但哪个更好用？

过滤方法更短更简洁，并且不会创建另一个冗余数组（从切片中删除的项目）。我会使用过滤器。

有另一个问题，但我不知道在不同的问题线程下问另一个问题是否合适

cmets 用于讨论具体问题/答案。创建一个新问题。