React正在将旧状态发送给其父级

React正在将旧状态发送给其父级

父级获得selecteditems的旧值的原因是因为它

setState()

是一个异步 *** 作。在这里查看说明：

setState()

不会立即变异，

this.state

但会创建待处理的状态转换。

this.state

调用此方法后进行访问可能会返回现有值。

因此，在您的代码中，您发送了一个更新状态的请求，并 在处理新状态之前 ，在父级中调用该方法，以通知父级状态，该状态仍然具有旧项。

修复1： 将当前状态发送给父级。
要使该项目发送当前状态，可以使用

setState()

提供的回调。在反应页面中也有解释：

第二个（可选）参数是一个回调函数，该函数将在

setState

完成并重新渲染组件后执行。

这样可以确保仅在

setState()

完成后才调用父对象。像这样：

this.setState(  {    title: item,    selectedItems: selectedItems,    open: false  },  this.sendStateToParent);

修复2 （可选，但建议）：将selecteditems状态移到父级。
如果您的父母需要了解所选项目，我建议不要将其置于列表状态。您的组件对所选项目所做的唯一一件事就是，每次单击某个项目时，将其发送给父项。
相反，最好是：

• 将selectedItems置于父状态
• 从父级，将selectedItems作为道具传递给组件
• 将

  handleItemClick

  逻辑移至父级
• 在父级内部，您更新selectedItems列表，并设置（父级）状态
• 使用新的selectedItems作为道具触发列表的重新呈现