Skip to content

Instantly share code, notes, and snippets.

Last active February 23, 2021 19:07
Show Gist options
  • Save monicao/243958d7498ed9fabe78 to your computer and use it in GitHub Desktop.
Save monicao/243958d7498ed9fabe78 to your computer and use it in GitHub Desktop.
React Lifecycle Cheatsheet

React Component Lifecycle

  • getInitialState
  • getDefaultProps
  • componentWillMount
  • componentDidMount
  • shouldComponentUpdate (Update only)
  • componentWillUpdate (Update only)
  • componentWillReceiveProps (Update only)
  • render
  • componentDidUpdate (Update only)
  • componentWillUnmount/constructor
  • componentDidUnmount



The result of getDefaultProps() will be cached and used to ensure that this.props.value will have a value if it was not specified by the parent component.


Triggered before render().


Called after render. Can access refs. The componentDidMount() method of child components is invoked before that of parent components. This is the place to call external libraries, use setTimeout, make ajax requests

shouldComponentUpdate(nextProps, nextState) - Update only

called when there are new props or state changes. return false to prevent a render. good for performance.

componentWillReceiveProps(nextProps) - Update only

Called before render when props change. Access to old props. It is not triggered after the component is mounted.

componentWillUpdate(nextProps, nextState)

Invoked immediately before rendering when new props or state are being received. Not called for the initial render. Cannot use setState in this method. Use componentWillReceiveProps instead. Use this as an opportunity to perform preparation before an update occurs.


Triggered when the state changes.

componentDidUpdate(prevState, prevProps) - Update only

Access to prevState, prevProps Use this as an opportunity to operate on the DOM when the component has been updated.


Clean up event bindings, etc.

Copy link

pablen commented Oct 18, 2017

Hey, the signature for componentDidUpdate() is wrong:

Copy link

bodaso commented Nov 7, 2017

same as above comment, it is componentDidUpdate(prevProps, prevState)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment