ComponentDidUpdate And PrevState

- 1 answer

Here's the scenario. I have a parent component, with a child component. Parent component does the ajax calls and pushes data down to the child.

When child component receives new data, within componentDidUpdate (of the child) i will re-set its internal state.

componentDidUpdate(prevProps, prevState) { 

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

I cannot think of a scenario where inside componentDidUpdate (of the child) I will need to check

prevState !== this.state

This is because when I pass new data into the child component, this.state will be equal to prevState (which will be the old state, prior to receiving new data); i.e. until such time as I run the above setState, the prev and current states will remain the same.

Hence my question is, under what scenarios will I need to check prevState != this.state ?



The same scenario that applies to props, can apply to props. It might so happen that on change of state you need to trigger an API call to fetch the data. Now you might decide to call a function in the setState callback, but if the same state is being changed from multiple places then componentDidUpdate is a good place.