Use the Lifecycle Method componentDidMount 5

JavaScript
1

Tell us what’s happening:
Having a very difficult time with this one. I don’t understand what to put in it, and have tried almost everything the lesson says to do, but I’m at a stop in the road where I can’t get past it.

Your code so far


class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      activeUsers: null
    };
  }
  componentDidMount() {
    setTimeout( () => {
      this.setState({
        activeUsers: 1273
      });
    }, 2500);
  }
  render() {
    return (
      <div>
        <h1>Active Users: { 'componentDidMount' }</h1>
      </div>
    );
  }
};

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.100 Safari/537.36 Avast/75.1.1528.101.

Link to the challenge:

3

It shows in the instructions to put something similar to that in the h1 element’s text, but I cannot figure it out with a sick brain.

4

Hi @LBDemaree,
the excercise is asking you to put in the curly brackets the value of the activeUsers that you find in the component’s state.

The function “componentDidMount” is one of a set of special functions that get called during the lifecycle of a component (they are called lifecycle hooks) and you can modify them to execute particular actions during those phase of the component’s life.
This exercise shows you that asynchronous API calls should be put in those method. The asynchronous API here is simulated with the use of a timeout of 2.5 seconds. After those 2.5 seconds the value of the active users in the state is updated and so is the component.

5

I’m sorry, but I don’t understand exactly what you are explaining here. I’ve tried a lot of things to figure this lesson out, but it’s wearing me down big time.

6

Basically you need to put this.state.activeUsers inside the brackets in the h1 element

7

Oh, alright. Thank you! I was so confused, because I have never done this type of coding yet in college, so I’m still new to coding. My current professor told me she has never done anything with React before, so she and I are both learning about it.