问题在React js中删除特定的子项

Question

[当我尝试删除更改状态的子项时，它会设置较旧的状态...因此，与其删除1个项目，它不会删除其后的所有内容。

我尝试了剪接，过滤，切片和其他方法来操纵我用于状态的数组。

这里的代码：

https://codesandbox.io/embed/tender-meitner-s75d4?fontsize=14

这是行不通的，因为我对国家一无所知。

const removeChildRule = index => {
let newArrayRule = [...rules];
newArrayRule.splice(index, 1);
setRules(newArrayRule);
};

选择要删除的元素应单独删除。并非所有孩子都在此之前。

Answer 1

为什么不过滤数组而不是拼接它：

const removeChildRule = index => {
  let newArrayRule =rules.filter( r => r!= index );
  setRules(newArrayRule);
};