Chevron Left Icon
Mounting Lifecycle Methods
Lesson 1 of 2
Chevron Right Icon
  1. 1
    Lifecycle methods are methods that get called at certain moments in a component’s life. You can write a lifecycle method that gets called right before a component renders for the first time. Yo…
  2. 2
    There are three categories of lifecycle methods: mounting, updating, and unmounting. This lesson is about the first category: mounting lifecycle methods. A component “mounts” when it ren…
  3. 3
    The first mounting lifecycle method is called componentWillMount. When a component renders for the first time, componentWillMount gets called right before render. Look at Example.js, and…
  4. 4
    render is a lifecycle method! We won’t go over render here - we’ve already talked about it plenty. However, you should understand how render fits into the mounting period. Whenever a component…
  5. 5
    The final mounting lifecycle method is called componentDidMount. When a component renders for the first time, componentDidMount gets called right after the HTML from render has finished loading….
  1. 1
    There are two categories that we haven’t yet discussed: updating and unmounting lifecycle methods. This lesson covers both. What is updating? The first time that a component instance rende…
  2. 2
    The first updating lifecycle method is called componentWillReceiveProps. When a component instance updates, componentWillReceiveProps gets called before the rendering begins. As one might expec…
  3. 3
    The second updating lifecycle method is called shouldComponentUpdate. When a component updates, shouldComponentUpdate gets called after componentWillReceiveProps, but still before the rendering be…
  4. 4
    The third updating lifecycle method is componentWillUpdate. componentWillUpdate gets called in between shouldComponentUpdate and render. componentWillUpdate receives two arguments: nextProps and …
  5. 5
    The last updating lifecycle method is componentDidUpdate. When a component instance updates, componentDidUpdate gets called after any rendered HTML has finished loading. Look at Example for an …
  6. 6
    A component’s unmounting period occurs when the component is removed from the DOM. This could happen if the DOM is rerendered without the component, or if the user navigates to a different web…
  7. 7
    Congratulations on making it to the end of our Introductory React courses! By this point, you have acquired all of the tools that you need to program in React! However, you aren’t quite done with…