React - Access Props Using this.props

Tell us what’s happening:

I seem to be stuck. I find it confusing. I’d like to know if I need to include anything additionally in the or not.

Your code so far

class App extends React.Component {
  constructor(props) {
    super(props);

  }
  render() {
    return (
        <div>
            { /* Change code below this line */ }
            <Welcome />
            <strong>{this.props.name}</strong>
            { /* Change code above this line */ }
        </div>
    );
  }
};

class Welcome extends React.Component {
  constructor(props) {
    super(props);

  }
  render() {
    return (
        <div>
          { /* Change code below this line */ }
          <p>Hello, <strong>{this.props.name}</strong>!</p>
          { /* Change code above this line */ }
        </div>
    );
  }
};

Your browser information:

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

Challenge Information:

React - Access Props Using this.props

give Welcome a prop of name and assign it a value of a string.


You can think of components like functions and props as arguments/parameters.

You have to give the component a prop and pass it a value.

<SomeComponent someProp="some value" />

Then inside the component definition you can access the value using.

this.props.someProp