Pass State as Props to Child Components

JavaScript
1

Tell us what’s happening:
I’m not sure what is incorrect. My current code is passing the first and last requirement except "The Navbar component should receive the MyApp state property name as props.
Help would be greatly appreciated. Thank You.

Your code so far


class MyApp extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      name: 'CamperBot'
    }
  }
  render() {
    return (
       <div>
         <Navbar MyApp = {this.state.name}/>
       </div>
    );
  }
};

class Navbar extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
    <div>
      <h1>Hello, my name is:{this.props.MyApp}</h1>
    </div>
    );
  }
};

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/front-end-libraries/react/pass-state-as-props-to-child-components/

2

What you have basically works, but it didn’t follow directions. You’ve created a prop named MyApp. But the test says “The h1 element in Navbar should render the name prop.” The prop being passed should be named name and not MyApp. That name would also make much more sense.

Please let us know if this is nor clear enough.

3

Thank you Kevin, I was getting hung up on the naming convention. This makes total sense.