Stuck on props part for React

Stuck on props part for React
0

#1

Below is what I have in passing the date prop to the CurrentDate var and Calendar component. Few questions/criteria remain:

(1)The CurrentDate component should have a prop called date.
(2)The date prop of the CurrentDate should contain a string of text.
(3)The CurrentDate component should render the value from the date prop in the p tag.
(4) Where does the value of the date come from? Is this some sort of system value built into Javascript? Txs for any help you can give

See code below:

const CurrentDate = (props) => {
  return (
    <div>
      
      <p>The current date is: {this.props.Date} </p>
      
    </div>
  );
};

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

  render() {
    return (
      <div>
        <h3>What date is it?</h3>
       
        <CurrentDate {this.props.Date} />
        
      </div>
    );
  }
};


#2

I’ve edited your post for readability. When you enter a code block into the forum, precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.


#3

Hi, can you post a link to the challenge?

Without recalling the exact challenge here is my attempt to help
1- actually need to write ‘date’ down with an equal sign in front of the date value in the relevant line <CurrentDate date=
2- this one should be fixed when you fix #1
3- instead of {this.props you already have props so you should be able to skip the ‘this’. but you should also use small case ‘date’ as that is the name of the prop from your initial #1 question
4- date’s value comes from the the system. I believe the challenge explains the exact way to get today’s date from the system (by system I think they mean browser. The client system)


#4

The instructions tell you to pass a prop named date to the CurrentDate component. The date prop value should be the current date obtained via JavaScript’s Date object. It shows you exactly how to do that with:

date={Date()}

If the above is added to the Calendar component’s rendering of the CurrentDate component, then a prop named date will pass the current date to the CurrentDate which is a stateless functional component.

Then inside the CurrentDate component’s render, you would simply refer to props.date where ever you want to display the current date.


#5

Thanks @RandellDawson, @hbar1st…very helpful… The upper cased “D” in my date prop sunk me and the “this” was not necessary. THANK YOU