React 16.3 Lifecycle Methods

  • UNSAFE_componentWillMount
  • UNSAFE_componentWillUpdate
  • UNSAFE_componentWillReceiveProps
  • getDerivedStateFromProps
  • getSnapshotBeforeUpdate

static getDerivedStateFromProps(nextProps, prevState)

The new method getDerivedStateFromProps is a static function and is used instead of componentWillReceiveProps with React 16.3.

componentWillReceiveProps

getDerivedStateFromProps

Now let’s look at the use of getDerivedStateFromProps for the same example. Instead of using this.setState as in our first example, we updated the state directly. If there is no update, it returns null.

getSnapshotBeforeUpdate(prevProps, prevState)

One of our new methods, getSnapshotBeforeUpdate, generally covers the workspaces of componentWillMount. In short, the virtual DOM is used before being reflected in the DOM.

References:

--

--

Full-stack Developer and loves ReactJS

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store