Pass Props to a Stateless Functional Component - confused

JavaScript
1

Tell us what’s happening:
Hello, i am new to react and my mind is a little overwhelmed by this programming style so far.

But now i dont understand the solution. I will try to explain it with my simple words:
Why i am “declaring” the date function in the class Calendar…then use it in the const CurrentDate with {props.date} and then use the CurrentDate in the class Calendar.

Its not logical and counterintuitiv. So i am defining something in A use it or referencing it in B and reference in A to B. And it works. What is the “workflow of the code?”

Why is {props.date) work in Current Date, when it (date=Date() ) will be declared later? Or is the Current Date first "The current date is : ‘error props.date is missing’ " and then after i declare the class it will try it again and now use function Date()?

I hope you can understand me and my problem.

Thanks for Help.

  **Your code so far**


const CurrentDate = (props) => {
return (
  <div>
    { /* Change code below this line */ }
    <p>The current date is: {props.date}</p>
    { /* Change code above this line */ }
  </div>
);
};

class Calendar extends React.Component {
constructor(props) {
  super(props);
}
render() {
  return (
    <div>
      <h3>What date is it?</h3>
      { /* Change code below this line */ }
      <CurrentDate date={Date()}/>
      { /* Change code above this line */ }
    </div>
  );
}
};

  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:95.0) Gecko/20100101 Firefox/95.0

Challenge: Pass Props to a Stateless Functional Component

Link to the challenge:

2

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.