Question

我正在尝试在Material UI中创建动态表格。问题是我想使其垂直而不是水平，所以这意味着我想向每列添加新行，如下所示：

Title1   Title2
a           1
b           2
c           3
d           4
e           5

基本上一切正常，但是我遇到了类似这样的错误：

index.js:1375 Warning: validateDOMNesting(...): <tr> cannot appear as a child of <td>.

我知道该错误的含义是，同时出现了3个其他错误，validateDOMNesting也存在问题，但是我设法解决了这个问题，但是我完全不知道如何解决此问题，我尝试添加新的Table和TBody，但是总是会破坏整个结构，并且表格看起来如此混乱，是否有任何建议可解决该错误并仍然保持表格现在的外观？谢谢

             <TableBody>
                  <TableRow>
                {batteryData.map((data, i) => {
                  return (
                    <StyledTableCell key={i}>

                      {data
                        .slice(Math.max(data.length - 50, 1))
                        .reverse()
                        .map((el, index) => {
                          return (
                            <TableRow key={index}>
                              <StyledTableCell>
                                {el.y == undefined ? "none" : el.y}
                              </StyledTableCell>
                            </TableRow>
                          );
                        })}

                    </StyledTableCell>
                  );
                })}

              </TableRow>
            </TableBody>

使用material-ui创建表时出错validateDomNesting

0 个答案: