React JS - getDerivedStateFromProps Life Cycle Method

 

getDerivedStateFromProps() method is called before render(), it means before rendering the element(s) in the DOM.

It is called in Mounting and Updating phases.

It is used when due to props, the state gets changed. It means state is dependent on props. 

In the above example, we are passing data using props from GetDerivedStateFromProp.js to GetDerivedStateFromProp2.js and inside getDerivedStateFromProps() method, the state is getting changed due to props.

Output :

As you can see in the above output, constructor() is getting called first, then getDerivedStateFromProps() and then render() and also you can see that the state is changed due to props.