freeCodeCamp Challenge Guide: Access Props Using this.props

Access Props Using this.props


Solutions

Solution 1 (Click to Show/Hide)

For this solution you need to remember first how to add props to your parent component:

 <Welcome name="Jessica"/>

Once you have the prop set, you can use this.props in your child component.

 <p>Hello, <strong>{this.props.name}</strong>!</p>

Full Solution

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

  }
  render() {
    return (
        <div>
            { /* Change code below this line */ }
            <Welcome name="Jessica"/>
            { /* 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>
    );
  }
};
18 Likes

Note: there is a typo in this line.

8 Likes