react component did update code example

Example 1: component did update arguments

componentDidUpdate(prevProps, prevState) {
  // only update chart if the data has changed
  if (prevProps.data !== this.props.data) {
    this.chart = c3.load({
      data: this.props.data
    });
  }
}

Example 2: componentDidUpdate

componentDidUpdate(prevProps, prevState) {
  if (prevState.pokemons !== this.state.pokemons) {
    console.log('pokemons state has changed.')
  }
}

Example 3: componentdidupdate arguments

componentDidUpdate(prevProps, prevState) {}

Example 4: prev props

componentDidUpdate(prevProps) {
  // Utilisation classique (pensez bien à comparer les props) :
  if (this.props.userID !== prevProps.userID) {
    this.fetchData(this.props.userID);
  }
}

Example 5: lifecycle method react

INITIALIZATION= setup props and state 
MOUNTING= constructor->componentWillMount->render->componentDidMount//Birth
UPDATE= shouldComponentUpdate->componentWillUpdate->render
  		->componentDidUpdate //Growth
UNMOUNTING= componentWillUnmount //Death

Example 6: shouldcomponentupdate

shouldComponentUpdate(nextProps, nextState) {
  return true;
}

Tags:

Misc Example