Front End Development Libraries:

Pass an Array as Props

My code:

const List = (props) => {
  { /* Change code below this line */ }
  return <p>{props.tasks.join(', ')}</p>
  { /* Change code above this line */ }
};

class ToDo extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <div>
        <h1>To Do Lists</h1>
        <h2>Today</h2>
        { /* Change code below this line */ }
        <p></p>
        <List tasks={["walk dog", "workout"]} />
        <h2>Tomorrow</h2>
        <List tasks={["walk dog", "workout", "gym"]}/>
        { /* Change code above this line */ }
      </div>
    );
  }
};

What you have to put in the p element?

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

Do you have a link to this challenge?

Yes: https://www.freecodecamp.org/learn/front-end-development-libraries/react/pass-an-array-as-props

Thank you, sorry i didnt know.

The third child has to be a List, look at the markup:

  <div>
        <h1>To Do Lists</h1>
        <h2>Today</h2>
        { /* Change code below this line */ }
        <p></p>
        <List tasks={["walk dog", "workout"]} />
  • Which one is the third child in there?