CODEWITHSUNDEEP
arraysreactjsmapping
Ahmed
Ahmed

Reputation: 51

Mapping nested arrays in React

I am learning React.js and Redux. I've nested arrays in arrays and mapped them in a table. The code works fine but I want to know if it's good practice or not. Thanks in advance.

return this.props.foodWeekPlan.map((course, i) => {
  return (
    <tr key={i}>
      {course.map((meal, j) => (
        <td key={j}>
          {meal.map((ingredients, k) => (
            <p key={k}>{ingredients}</p>
          ))}
        </td>
      ))}
    </tr>
  );
});

};

Upvotes: 0

Views: 101

Answers (1)

anerco
anerco

Reputation: 107

If you want a good practice, try writing a component for each object you mapping then, your code will look something like this:

  return this.props.foodWeekPlan.map((course, i) => <Course key={i} meals={course.meals}/>);

Upvotes: 1

Related Questions