Reading: Component Composition - jacobwendt-401-advanced-javascript/cr-js-401d3 GitHub Wiki

Mounting

  • Since class-based components are classes, hence the name, the first method that runs is the constructor method. Typically, the constructor is where you would initialize component state.

Updating

  • This phase is triggered every time state or props change. Like in mounting, getDerivedStateFromProps is called (but no constructor this time!).

Unmounting

  • forceUpdate is a method that directly causes a re-render. While there may be a few use cases for it, it should typically be avoided.
  • getDerivedStateFromError on the other hand is a lifecycle method that isn’t directly part of the component lifecycle. In the event of an error in a component, getDerivedStateFromError runs and you can update state to reflect that an error occurred. Use this method copiously.