Reference with JavaScript

[crystalio303]

Both attempts fail one test and pass three others. I am looking for middle ground that passes both failed ones at once. I do not know where to look for referencing using JavaScript in render.
The rendered h1 tag should include reference to {name}.

class MyComponent extends React.Component {
constructor(props) {
  super(props);
  this.state = {
    name: 'freeCodeCamp'
  }
}
render() {
  // Change code below this line
  let name = MyComponent.name;
  // Change code above this line
  return (
    <div>
      { /* Change code below this line */ }
      <h1>{this.state.name}</h1>
      { /* Change code above this line */ }
    </div>
  );
}
};

The rendered h1 component should contain text rendered from the component’s state.

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      name: 'freeCodeCamp'
    }
  }
  render() {
    // Change code below this line
    let name = name;
    // Change code above this line
    return (
      <div>
        { /* Change code below this line */ }
        <h1>{name}</h1>
        { /* Change code above this line */ }
      </div>
    );
  }
};

Challenge: Render State in the User Interface Another Way

Link to the challenge:

freeCodeCamp.org

[lasjorg]

You simply assign the value of this.state.name to a variable inside the render and use that variable.

[crystalio303]

You are right. I will try to figure out what is going on.

class MyComponent extends React.Component {
constructor(props) {
  super(props);
  this.state = {
    name: 'freeCodeCamp'
  }
}
render() {
  // Change code below this line
  let name = this.state.name;
  // Change code above this line
  return (
    <div>
      { /* Change code below this line */ }
      <h1>{name}</h1>
      { /* Change code above this line */ }
    </div>
  );
}
};

//let name = MyComponent.name; I am unsure of what goes in render, maybe this. Yes, this is how to store  a variable in render using JavaScript.
//h1 should include a reference to name.

We are setting name in the render area, then using that variable in the return statement. JavaScript variables are inserted into React with braces.