关于 shouldComponentUpdate() 的奇怪问题答案

【问题标题】：weird question about shouldComponentUpdate()关于 shouldComponentUpdate() 的奇怪问题
【发布时间】：2019-08-28 06:33:59
【问题描述】：

我不明白 shouldComponentUpdate() 方法如何访问旧状态，据我所知，shouldComponentUpdate() 在道具或状态更改后被触发。

假设您调用 setState() ，之后当前状态将被更改，并将更新为新状态。但是即使在将状态更新到最新版本之后也会触发 shouldComponentUpdate()。那么 shouldComponentUpdate() 中的 this.state 怎么能返回旧状态呢？

shouldComponentUpdate(nextProps, nextState) {
   console.log(this.state); // how can this be old state?
}

有人知道吗？非常感谢。

【问题讨论】：

【解决方案1】：

在组件上的任何内容更新之前调用此生命周期函数，包括响应文档强调的状态。

shouldComponentUpdate() 在接收到新的 props 或 state 时在渲染之前调用。

所以在shouldComponentUpdate被调用的那一刻，新的状态还没有被应用，this.state仍然指向旧的状态。

【讨论】：

谢谢。好的，最后一个问题。那么如果 shouldComponentUpdate() 方法返回“true”，nextState 会覆盖 oldState？
是的，如果你返回 false，React 不会更新那个组件。这是该函数文档的链接，它简短且解释清楚reactjs.org/docs/react-component.html#shouldcomponentupdate

【解决方案2】：

最简单的表达方式是 - 当元素上方的某些内容在层次结构中发生变化时触发渲染。组件本身是否会在上面发起的这个渲染周期内渲染，取决于 shouldComponentUpdate 的返回值。

如果此方法返回 true，则渲染将更改组件的当前状态，直到 shouldComponentUpdate 返回 true。

因此 shouldComponentUpdate 方法中的 this.state 具有较旧的状态，而参数中的 nextState 具有最新的状态。

【讨论】：