过滤方法是修改数组而不触及状态的最佳方法。

它根据条件返回一个新数组。

在你的例子中，过滤器检查条件person。Id !== Id，并根据条件创建一个不包含该项的新数组。

const [people, setPeople] = useState(data);

const handleRemove = (id) => {
   const newPeople = people.filter((person) => person.id !== id);

   setPeople( newPeople);
 };

<button onClick={() => handleRemove(id)}>Remove</button>

不明智的: 但如果没有任何id，也可以为条件使用项索引。

索引!== itemIndex

非常简单 首先定义一个值

state = {
  checked_Array: []
}

Now,

fun(index) {
  var checked = this.state.checked_Array;
  var values = checked.indexOf(index)
  checked.splice(values, 1);
  this.setState({checked_Array: checked});
  console.log(this.state.checked_Array)
}

简单的解决方案使用切片而不改变状态

const [items, setItems] = useState(data);
const removeItem = (index) => {
  setItems([
             ...items.slice(0, index),
             ...items.slice(index + 1)
           ]);
}

过滤方法是修改数组而不触及状态的最佳方法。

它根据条件返回一个新数组。

在你的例子中，过滤器检查条件person。Id !== Id，并根据条件创建一个不包含该项的新数组。

const [people, setPeople] = useState(data);

const handleRemove = (id) => {
   const newPeople = people.filter((person) => person.id !== id);

   setPeople( newPeople);
 };

<button onClick={() => handleRemove(id)}>Remove</button>

不明智的: 但如果没有任何id，也可以为条件使用项索引。

索引!== itemIndex

一些答案提到了使用“splice”，正如Chance Smith所说的那样，它使数组发生了突变。我建议你使用调用slice的方法 (这里是'slice'的文档)，它会对原始数组进行复制。

使用.splice从数组中删除项。使用delete，数组的索引不会被改变，但特定索引的值将是未定义的

splice()方法通过删除现有元素和/或添加新元素来更改数组的内容。

语法:数组。splice(start, deleteCount[， item1[， item2[，…]]])

var people = ["Bob"， "Sally"， "Jack"] var toRemove = 'Bob'; var index = people.indexOf(toRemove); if (index > -1){//确保item存在于数组中，如果没有if条件，-n个索引将被考虑从数组的末尾开始。 人。拼接(指数(1); ｝ console.log(人);

编辑:

正如justin-grant指出的，作为经验法则，永远不要改变这个。直接调用setState()，因为之后调用setState()可能会替换您所做的突变。对待这个问题。状态，仿佛它是不可变的。

另一种方法是，在其中创建对象的副本。状态和操作副本，使用setState()将它们赋值回去。数组#映射，数组#过滤器等可以使用。

this.setState({people: this.state.people.filter(item => item !== e.target.value);});