PLS Help: Review Using Props with Stateless Functional Components

JavaScript
1

HI! Why do you think my code is not valid?

class CampSite extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <div>
        <Camper />
      </div>
    );
  }
};
// change code below this line
Camper.defaultProps = {name: 'CamperBot'};
Camper.propTypes = PropTypes.string.isRequired;

class Camper extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <p>{props.name}</p>
    );
  }
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) 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/review-using-props-with-stateless-functional-components

3

Thanks a lot for being so quick and helpful!!

5

You’ve been right about everything, thanks a lot! I’ve really needed this. :slightly_smiling_face:

6

class CampSite extends React.Component {

constructor(props) {

super(props);

}

render() {

return (

  <div>

    <Camper name='camper' />

  </div>

);

}

};

// change code below this line

class Camper extends React.Component {

constructor(props) {

super(props);

}

render() {

return (

  <p>{this.props.name}</p>

);

}

};

// change code below this lin
Camper.propTypes = {name:PropTypes.string.isRequired};
Camper.defaultProps = { name : “user”};
Camper.defaultProps = {name:‘CamperBot’};
Camper.propTypes = { name:PropTypes.string.IsRequired };