Stuck at Compose React Components

I’m stuck on this one, I tried everything already including the tips but I keep getting that I’m not meeting:

a) The TypesOfFood component should return the Fruits component.
b) The TypesOfFood component should return the Vegetables component below the Fruits component.

I’d say the code does that and the components can be given from grated in the background it says, so I don’t know what’s wrong. Thanks

Your code so far


class Fruits extends React.Component {
constructor(props) {
  super(props);
}
render() {
  return (
    <div>
      <h2>Fruits:</h2>
      <NonCitrus />
      <Citrus />
    </div>
  );
}
};

class TypesOfFood extends React.Component {
constructor(props) {
   super(props);
}
render() {
  return (
    <div>
      <Fruits />
      <Vegetables />
    </div>
  );
}
};

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.135 Safari/537.36.

Challenge: Compose React Components

Link to the challenge:

Hi

You just deleted an line that’s already built in the test.

        <h1>Types of Food:</h1>

This one to be more precise.

class TypesOfFood extends React.Component {
  constructor(props) {
     super(props);
  }
  render() {
    return (
      <div>
        <h1>Types of Food:</h1>
        { /* change code below this line */ }
        <Fruits />
        { /* change code above this line */ }
        <Vegetables />
      </div>
    );
  }
};

1 Like