Life cycle of a component can be defined as the series of methods that are invoked in different stages of the component existence.
Stages are:
• Initialization
• Mounting
• Updating
• Unmounting
Function of each Phase of Cycle
1. Initialization
In this phase, we have to define the props and initial state of the component. This is done in the constructor of the component.
2. Mounting
In this phase, Initialization of the component is completed and the component is mounted on the DOM and rendered on the first time on web page.
• componentWillMount() Function
• componentDidMount() Function
3. Updating
It is the phase where the states and the props of a component are updated followed by some user events like click or press keyboard button etc.
• componentWillRecieveProps() Function
• setState() Function
• shouldComponentUpdate() Function
• componentWillUpdate() Function
• componentDidUpdate() Function
4. Unmounting
This is the final phase of the life cycle of the component that is the phase of unmounting the component from the DOM.
• componentWillUnmount() Function
Note: React follows a default procedure in the Naming Conventions of these predefined functions where the functions containing “Will” represents before some specific phase and “Did” represents after the completion of that phase.
Top comments (0)