Review Using Props with Stateless Functional Component[2]s

Review Using Props with Stateless Functional Component[2]s
0

#1

Tell us what’s happening:
I’ve been trying to find out how to add a defaultprops to anything in this code for almost an hour now… I’ve used React Github, YouTube, Google and StackOverflow. I’ve gotten all the checks green but that one. And, I don’t know what I’m doing in general with React. And, I wish you guys had full examples like you did for your other courses so the newbies could be eased into it.

Your code so far


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

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.3; 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/review-using-props-with-stateless-functional-components


#2

class CampSite extends React.Component {
constructor(props) {
super(props);
}
render() {
return (




);
}
};
// change code below this line
const Camper = (props) => (

{props.name}

); Camper.defaultProps = { name: 'Camperbot' }; Camper.propTypes = { name: PropTypes.string.isRequired }; //I also tried this

#3

To declare defaultProps, you must use the defaultProps methos on Camper. For example,

Camper.defaultProps = {??????: '??????'};

#4

have to add defaultProps to Camper.

Camper.defaultProps={name: "CamperBot"}

be careful with comma, I was stuck because of it. eg:

Camper.defaultProps={xxxx: "CamperBot",}//doesnt work
Camper.propTypes={name: PropTypes.xxxxxx.xxXxxxxxxx,}//doesnt work

in your second example it throws an error because you wasn’t including the p.

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

not

{props.name}