我想了解 ReactJS 中的 SetState 和 Prevstate

Question

我是 ReactJS 的新手，我在我的项目中使用向导表单，它使用户能够进行下一步和上一步。我复制了下一个按钮的一些代码，但老实说不明白它的意思。

你能帮我理解下面的代码吗：

next() {
    this.setState(prevState => ({ current: prevState.current + 1 }));
}

Answer 1

感谢您的贡献。

正如评论中所建议的，您可能应该查看文档，但由于您是新的贡献者，我想我会尝试回答您的问题。

State 和 setState 如何工作

每个组件反应类都有一个“状态”。当“状态”更新时，组件将重新渲染。setState是用于更新组件状态的方法。this指组件本身。

您的组件state对象可能是这样开始：{ current: 0, something: 'foo' }。

next() 在做什么

当你调用时next()，那么setState也会被调用。setState用回调调用。回调提供了一个参数，这里命名为prevState- prevState 是state组件上的当前值，因此{ current: 0, something: 'foo' }.

的返回值setState将设置提供的状态对象上的任何字段。调用后this.setState， 的新值component.state将是{ current: 1, something: 'foo' }。

重新渲染

将触发组件的重新渲染，因为新状态和先前状态对象的浅比较将返回false。

希望这可以帮助！