如何在 React 状态下安全地从数组中删除项目？

修改 React 中的项目列表：删除元素

在 React 中，管理状态对于操作应用程序数据至关重要。考虑这样一个场景，您所在的州有一个名为“people”的数组，并且您需要从中删除一个项目（例如“Bob”）。然而，简单地直接删除项目可能不会产生期望的结果。

在这种情况下，必须避免直接改变状态对象（包括数组）。要有效地修改“people”数组，请创建一个包含所需更改的新副本。

一种方法是使用 Array.prototype.filter() 方法：

removePeople(e) {
    this.setState({
        people: this.state.people.filter(function (person) {
            return person !== e.target.value; // Exclude the target person ("Bob")
        })
    });
}

此方法创建一个新数组，其中包含与所提供的条件不匹配的所有元素（即“Bob”）。原始的“people”数组保持不变，新数组被分配给状态，确保您的应用程序对更新后的状态做出正确的反应。

以上是如何在 React 状态下安全地从数组中删除项目？的详细内容。更多信息请关注PHP中文网其他相关文章！