reactjs - Material UI 表 - 使用跨度的等宽列？

Question

我正在尝试使用 Table Material UI 中的组件来构建数据表。但是，我正在努力为我的数据表制作等宽的列。目前我正在尝试这样的事情:

<TableCell key={props.name} style={{width: '25%'}}>
          <span
            style={{
              width: `${(100 / props.numCols)}%`,
              whiteSpace: "pre",
              overflow: "scroll",
              display: 'block'
            }}
          >
            {props.value}
          </span>
 </TableCell>

然而，这似乎并不能解决问题。我希望有 4 列等宽，但在这张照片中，您会看到只能看到 3 列(第 4 列在屏幕外)，尤其是第 3 列非常长。我将不胜感激任何指针!

编辑:似乎是 width属性实际上占用了文本长度的 100%？有没有办法让它占据 table 的宽度？

Answer 1

我知道这个问题有点过时了，但是您可以执行以下操作来更好地控制表格行宽分布:

<Table style={{ tableLayout: 'fixed' }} > .. </Table>