REACTDOM返回几行表和REACTDOM错误

Question

我在创建/返回多个响应行时遇到了困难。返回两行时出错：<tr> can't be a child of <tr>。

我现在的密码

我正在创建一个简单的日历，到目前为止，我有一个标题，其中包括周一到周日的一周中的每一天。我要：

• 身体有4-5排(每周一排)。
• 要应用这一周(而不是从API - firstWeek、secondWeek等页面地图数据顶部的数组等)

从第一个元素到最后一个元素，整个月的日历应该如下所示：

firstWeek[0], firstWeek[1], firstWeek[2] etc etc
[secondWeek[0], secondWeek[1] etc etc
thirdWeek[0], secondWeek[1] etc etc

我考虑过使用循环，但不知道如何处理它--我应该使用其他的方法吗？在修复我的设计模式之前，我必须在返回几行时修复那些DOM错误。

是的，我知道这是个代号，但我不知道如何还它不同：

  var firstWeek = days[0].map(day=>day.day_number);
  var secondWeek = days[1].map(day=>day.day_number);
  var thirdWeek = days[2].map(day=>day.day_number);
  var forthWeek = days[3].map(day=>day.day_number);
  var fifthWeek = days[4].map(day=>day.day_number);

Answer 1

React是警告您，您正在尝试将表行<tr>嵌套为另一个表行的子表，该表行无效。

您想要做的是，每个月的每周映射到它自己的行，其中每一行都显示自己的数据。然后，在表中正确地呈现一组行。就像这样：

    const tableRows = weeks.map((week) => {
       return (
           <tr>
               { week.map(dayOfWeek => <td>{ dayOfWeek.someData }</td>) }
           </tr>
       );
    });

    return <table><tbody>{ tableRows }</tbody></table>