当TableHead和TableBody位于两个不同的部分时,如何正确呈现表?

我必须使用tableHead和tableBody渲染表。我希望它们的每一列都具有相同的宽度。我可以那样做吗?

<Table container aria-label="simple table">
  <TableHead>
    <TableRow>
      <TableCell>
        <span className={classes.headerTableText}>
        ID
        </span>
      </TableCell>
      <TableCell align="center">
        <span className={classes.headerTableText}> Name </span>
      </TableCell>
      <TableCell> Name</TableCell>
    </TableRow>
  </TableHead>
</Table>
<Table>
  <TableBody>
    <TableRow hover>
      <TableCell>
        <span>1</span>
      </TableCell>
      <TableCell align="center">
        <span>Me</span>
      </TableCell>
      <TableCell align="right">
        <span>U</span>
      </TableCell>
    </TableRow>
  </TableBody>
</Table>
评论
  • 不在服务区
    不在服务区 回复

    您可以计算表格列之一的宽度,然后将该宽度值作为参数发送给另一列。

    您还可以使用挂钩来管理列的宽度并同步两个表。