ComponentDidUpdate 和 prevState

Question

场景如下。我有一个 parent 组件和一个 child 组件。 Parent 组件执行 ajax 调用并将数据向下推送到 child。

当 child 组件接收到新数据时，在（child 的）componentDidUpdate 中，我将 re-set 它的内部状态。

componentDidUpdate(prevProps, prevState) { 

    if ( prevProps.myRow !== this.props.myRow ) { //check for when new data is passed into this component from its parent / container...
            this.setState({
                editableRowObj    : this.props.myRow    //... only then I should bother updating the state with the new data passed in.         
            })
    }
}

我想不出在 componentDidUpdate（child 的）内部需要检查的场景

prevState !== this.state

这是因为当我将新数据传递到 child 组件时，this.state 将等于 prevState（这将是接收新数据之前的旧状态）；也就是说，直到我运行上述 setState 时，之前和当前状态将保持不变。

因此我的问题是，在什么情况下我需要检查prevState != this.state ?

Answer 1

适用于道具的相同场景，可以适用于道具。可能会发生这样的情况，即在状态更改时您需要触发 API 调用来获取数据。现在您可能决定在 setState 回调中调用一个函数，但是如果从多个地方更改相同的状态，那么 componentDidUpdate 是个好地方。

Answer 2

按原样比较状态没有任何意义，因为它们永远不会相同。您以这种方式比较的是对状态的引用，而不是嵌套值。另外，你应该小心这个函数，并且在 componentDidUpdate 中使用 setState 被认为是一种反模式并且是不可取的 - 甚至有一个 ESlint rule 强制不要这样做。

比较状态（或道具）的一个场景是在函数 shouldComponentUpdate(nextProps, nextState) 中，您可以在其中决定组件是否应该更新（returns 布尔值）。

ComponentDidUpdate 和 prevState

ComponentDidUpdate and prevState

reactjs

react-lifecycle

react-state