Question

this.state = { isOpen: false };


onClickHandler() {
        this.setState(currentState => ({
          isOpen: !currentState.isOpen
        }));
      }

这里只有一个状态isOpne，但是当我设置一个状态时，我看到currentState，这意味着什么

Answer 1

要使用当前状态计算新状态，您可以做得很好：

this.state = { isOpen: false };


onClickHandler() {
        this.setState(currentState => ({
          isOpen: !this.state.isOpen
        }));
      }

但是，这是docs中提到的不良做法：

状态更新可能是异步的。 React可能会批处理多个setState（）调用一次更新以提高性能。因为this.props和 this.state可能异步更新，您不应依赖于它们计算下一个状态的值。

因此，当我们需要从当前状态计算下一个状态时，setState将以setState(myCurrentState => {...});的形式访问当前状态。您甚至可以将props作为第二个参数来访问，例如setState((myCurrentState, myProps) => {...});。

因此，在您的情况下，currentState仅指即将发生状态更新之前的给定时刻的组件状态。

Answer 2

这是什么意思？

如果您去那里的文档，您会发现有两种更新状态的方法。

使用对象方式
通过一个函数。

1。

使用此方法，您只需要传递状态对象的属性即可进行更新。像：

this.setState({isOpen: !this.state.isOpen});

2。

在这种情况下，您将其命名为currentState，它指的是尚未更新的先前状态。

this.setState(currentState => ({ // <---currentState is named as prevState in docs
      isOpen: !currentState.isOpen
}));

您可以将其视为this.state。

Answer 3

在上面的示例中，currentState是以前的状态，当您有多个项目（如许多用户列表）并且想要进行比较并希望将其中某些项与true否定进行比较时，您可以使用过，但是可以使用，但是对于切换状态，您可以简单地使用下面的代码：

this.state = { isOpen: false };


onClickHandler() {
        this.setState({
          isOpen: !this.state.isOpen
        });
      }

currentState在这里是什么意思

3 个答案:

1。

2。