Solution in need

JavaScript
1

Tell us what’s happening:
I don’t know how to solve this can anyone help?
There are two functional components defined in the code editor, called TypesOfFruit and Fruits . Take the TypesOfFruit component and compose it, or nest it, within the Fruits component. Then take the Fruits component and nest it within the TypesOfFood component. The result should be a child component, nested within a parent component, which is nested within a parent component of its own!

Your code so far


const TypesOfFruit = () => {
return (
  <div>
    <h2>Fruits:</h2>
    <ul>
      <li>Apples</li>
      <li>Blueberries</li>
      <li>Strawberries</li>
      <li>Bananas</li>
    </ul>
  </div>
);
};

const Fruits = () => {
return (
  <div>
    { /* change code below this line */ }

    { /* change code above this line */ }
  </div>
);
};

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

render() {
  return (
    <div>
      <h1>Types of Food:</h1>
      { /* change code below this line */ }

      { /* change code above this line */ }
    </div>
  );
}
};

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.89 Safari/537.36.

Challenge: Use React to Render Nested Components

Link to the challenge:

2

Okay so you need to add code between these two lines

{ /* change code below this line */ }

If you are struggling with them my advice is to go back to the previous lessons and do a recap :slight_smile:

  1. Stateless functional component - using a JavaScript function.
  2. Define a React component using the ES6 syntax.
3

I wish they explained it better. I didn’t realize there are two sections in the code to put an answer, I kept doing it together in the first section and couldn’t figure it out. The solution is in the first part of the code you put TypeOfFruit with the brackets and / Then scroll down to the next lines of code and there is another green comment that says add your code an you do Fruits with the brackets and / just like in the previous exercise. Hope this helps.