javascript - React setState 调用不更新状态

Question

我有一个 React setState 调用选择行为不当，但我不知道发生了什么。我想我已经缩小了范围 - 这是有问题的方法:

  setShowDeleteEventModal = (value) => {
    console.log('dude', value); //logs true
    this.setState(() => ({ showDeleteEventModal: value }), () => {
      console.log('hey', this.state); //logs state showing 'showDeleteEventModal: false'
    });
  };

到目前为止我做了什么:

检查它是否是异步的 - 它不是，基于回调函数中出现的问题，尽管我也使用了 setTimeout 来检查它；确保我已正确声明状态；检查变量的拼写，包括使用“查找”来确保它们全部显示在相同的拼写下；检查值的类型是否为字符串 - 它是 bool 值；重写了整个实现。

期望的行为:showDeleteEventModal 在 setState 调用后显示 true。实际行为:事实并非如此。

我从子组件中的 onClick 按钮调用此方法，但由于“dude”和“true”显示在屏幕上，我知道它正在进入此处。 showDeleteEventModal 是一个控制是否显示模态框的开关。

最让我困惑的部分是，我在同一个文件中有一个极其相似的设置，可以完美地工作。这是另一种方法:

setShowOnMap = (value) => {
  this.setState(() => ({ showOnMap: value }));
};

这是从子组件调用按钮并传入 prop:

<div className = "button background-red width15"
          onClick = {props.switchModals}
        >
          Remove this event
        </div>

switchModals = {
  () => {
    this.setShowDeleteEventModal(true);
    this.closeModal()
  }
}

整个文件对于在这里发布来说有点长，但希望这足够了，我只是错过了一些愚蠢的东西。

Answer 1

setShowDeleteEventModal = (value) => {
  console.log('dude', value); //logs true
  this.setState({ showDeleteEventModal: value }, () => {
    console.log('hey', this.state); //logs state showing 'showDeleteEventModal: false'
  });
};

尝试删除箭头函数调用，对于第一个参数，只需放置状态对象即可，就像上面一样