Javascript ReactJS中的prevState是什么？

我想问这个问题可能很傻，但相信我，我是个新手。有人能解释一下为什么我们在ReactjS中使用prevState。我尽力去理解，但失败了

这是我的代码。请帮助我理解

 state = {
    placeName : '',
    places : []
}



placeSubmitHanlder = () => {
    if(this.state.placeName.trim()===''){
      return;
    }
    this.setState(prevState => {
      return {
        places : prevState.places.concat(prevState.placeName)
      };
    });
  };

---

prevState

是传递给setState回调函数的参数的名称。它保存的是React触发

setState

之前的状态值；由于

setState

执行批处理，因此，当您希望基于先前的状态值更新新状态时，了解先前的状态有时很重要

因此，如果多个setState调用正在更新同一状态，批处理setState调用可能会导致设置不正确的状态。考虑一个例子：

state = {
   count: 0
}
updateCount = () => {
    this.setState({ count: this.state.count + 1});
    this.setState({ count: this.state.count + 1});
    this.setState({ count: this.state.count + 1});
    this.setState({ count: this.state.count + 1});
}

在上面的代码中，您可能期望count的值为4，但实际上它是1，因为对setState的最后一次调用将在批处理期间覆盖任何以前的值。解决此问题的方法是使用函数设置状态：

updateCount = () => {
    this.setState(prevstate => ({ count: prevstate.count + 1}));
    this.setState(prevstate => ({ count: prevstate.count + 1}));
    this.setState(prevstate => ({ count: prevstate.count + 1}));
    this.setState(prevstate => ({ count: prevstate.count + 1}));
}

---

下面是一个带有注释代码的演示，为您提供更多信息：

反应文档：

[React ES6 class]API与React.createClass类似，但getInitialState除外。您没有提供单独的getInitialState方法，而是在构造函数中设置自己的state属性

国家从何而来

prevState来自setState api：

还可以通过签名函数（state、props）传递函数。在某些情况下，当您希望在设置任何值之前查询state+props的先前值的原子更新排队时，这可能非常有用。例如，假设我们希望在状态中增加一个值：

this.setState(function(previousState, currentProps) {
  return {
     value: previousState.value + 1
  };
});

---

当您想用最后一个状态的参数替代当前状态时，可以使用它

从React文档：

根据React文档，“React可以将多个

setState（）

调用批处理到单个更新中以获得性能。因为

this.props

和

this.state

可以异步更新，所以您不应该依赖它们的值来计算下一个状态。”

要修复它，请使用第二种形式的

setState（）

，它接受函数而不是对象。该函数将接收前一个状态作为第一个参数，应用更新时的props作为第二个参数

---

@S.Haaviv感谢您的评论。请您解释一下您在回答中提到的“以前的状态值”好吗。我的代码中的前一个状态。当使用setState设置为新状态时，prevState是当前状态（在setState函数中）。因为react可以进行一些批处理，并且它是异步的，所以状态可能会随着时间的推移而改变，因此您不能依赖于此。请您解释一下前一个值的含义以及该值的来源。明白了，谢谢。最后一个问题。你能解释一下这段代码吗<代码>this.setState（prevState=>{return{places:prevState.places.concat（prevState.placeName）}；}）你可以查看这个问题，了解更多关于这个问题的细节。实际上，我理解了所有的幕后操作，但在这一行中混淆了

prevState.places.concat

这是什么意思。感谢

prevState.places.concat（prevState.placeName）

将状态中以前的placeName值推送到places状态数组，并返回一个新数组，我们使用该数组来设置places状态抱歉，我不理解..我不认为这篇文章是链接文章的1:1副本，它声称是链接文章的副本。首先，链接的帖子一次问了三个问题，而你应该在SO上每个帖子问一个问题。这篇文章关注的是一个像我这样的新手在我们学习的过程中提出的问题。所有这些中最重要的部分是，

prevState

没有在react文档中明确讨论。这篇文章的当前最重要的答案详细阐述了prevState比这篇文章的链接文章或者react文档更进一步。

this.setState(function(previousState, currentProps) {
  return {
     value: previousState.value + 1
  };
});