Отображение вложенных массивов в React

Question

Я изучаю React.js и Redux. Я вложил массивы в массивы и отобразил их в таблице. Код работает нормально, но я хочу знать, хорошая ли это практика или нет. Заранее спасибо.

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>
  );
});

};

Answer 1

Если вам нужна хорошая практика, попробуйте написать компонент для каждого отображаемого объекта, тогда ваш код будет выглядеть примерно так:

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