Need React help

1

Getting a recipes not defined in the map call. What am I overlooking?

class App extends React.Component {
  constructor () {
    super();
    this.state = {recipes: ["Crepes", "Lasange", "Omlete"]}
  }
  render () {
    return (
      <div>
        <Recipe>Crepes</Recipe>
        {this.state.recipes.map(recipe => <Recipes>{recipe}</Recipes>)}
        <Rfooter />
      </div>
    );
  }
}
2

Here is the codepen

3

Shouldn’t recipe be passed to <Recipes> as a prop? (the {recipe} part of your map, I mean?)

Also, it looks like you don’t have a <Recipes> component defined.

<Recipe>, yes.
<Rfooter>, yes.

<Recipes>, no. :frowning:

1 Like
4

Recipes vs. Recipe That was it!
Thank you!