ComponentDidUpdate和prevState

Question

这是场景。我有一个父组件，有一个子组件。 父组件执行ajax调用并将数据下推到子组件。

当子组件接收到新数据时，在（子组件的）componentDidUpdate中，我将重置其内部状态。

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内部的情况

  

prevState！== this.state

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

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

Answer 1

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

Answer 2

按原样比较状态没有意义，因为它们永远不会相同。您正在以这种方式进行比较的是对状态的引用，而不是嵌套的值。另外，您应该谨慎使用此功能，在componentDidUpdate内部使用setState被认为是反模式，不建议使用-甚至有ESlint rule强制不要这样做。

用于比较状态（或道具）的一种情况是在函数shouldComponentUpdate(nextProps, nextState)中，您可以确定组件是否应该更新（返回布尔值）。