Question

我试图在单击项目时使用挂钩删除嵌套状态的项目。正确的方法是什么？

const ParentComponent = () ={
  const initialState = {
  key : 1
  color: red
  child1 :{
      child2: {
        [{id: 1
          value: 10},
         {id: 2
          value: 20},
         {id: 3
          value: 30},
        ]
     }
  }
  const {itemList, setItemList} = useState(initialState)

  const handleRemoveClick = (item) => {
     setState(prevState => {
        const setItemList = prevState.child1.child2.filter(o => o.id !== item.id);
        return { newState }
        })
}

希望在单击项目1时删除项目1

Answer 1

万一它可以帮助别人，可以通过以下解决方案解决：

  const handleRemoveClick = (index, item) => {
      let tmpList = itemList.child1.child2;
      tmpList.splice(index-1, 1 );
      setItemList({...itemList,
              child1: {
                  ...itemList.child1,
                  child2: tmpList
                  }})

使用挂钩时以全局状态删除嵌套数组项

1 个答案: