React: Review Using Props with Stateless Functional Confused Components

JavaScript
1

Tell us what’s happening:
Why is my solution not getting accepted while the hint provided gets accepted. I am confused why this is happening. Please point out any mistakes. Thanks

const Camper = props =>

{props.name}

;

Camper.defaultProps = {
name: “CamperBot”
};

Camper.propTypes = {
name: PropTypes.string.isRequired
};

Your code so far


class CampSite extends React.Component {
constructor(props) {
  super(props);
}
render() {
  return (
    <div>
      <Camper/>
    </div>
  );
}
};
// change code below this line

const Camper = props =>{
  return(
    <p> {props.name} </p>
  )}

Camper.defaultProps = {name: 'CamperBot'}

Camper.propTypes = { name: PropTypes.string.isRequired }

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 Safari/537.36.

Challenge: Review Using Props with Stateless Functional Components

Link to the challenge:
https://www.freecodecamp.org/learn/front-end-libraries/react/review-using-props-with-stateless-functional-components

2

This line declares that props.name is required, meaning you must pass name as props to <Camper />