React Material UI Column width 属性不展开答案

【问题标题】：React Material UI Column width property does not expandReact Material UI Column width 属性不展开
【发布时间】：2021-11-02 20:18:36
【问题描述】：

所以我正在尝试使用 React Material UI 表。我正在尝试为列设置 auto 属性，但它没有按预期扩展。在这里，我希望列完全展开而不是包裹。

我试图在<Table size="small" style={{ width: auto}}> 中添加属性，但它没有响应。另外，如果我在这里按像素值设置值，恐怕会是一个不好的做法？

有没有更好的方法来按百分比或其他一些灵活的类型设置各个列？还是整个表？

【问题讨论】：

能否在codesandbox分享一个简单的代码示例？
我的代码类似于以下示例，但列的名称更大，加上更多的列，因此它可以随着水平滚动codesandbox.io/s/suq42?file=/demo.tsx 展开

标签： css reactjs material-ui material-design react-material

【解决方案1】：

只需将 white-space: "nowrap" 设置为th。以下是根据您的代码所做的更改：

const StyledTableCell = withStyles((theme: Theme) =>
  createStyles({
    root: {
      whiteSpace: "nowrap"
    },
    head: {
      backgroundColor: theme.palette.common.black,
      color: theme.palette.common.white
    },
    body: {
      fontSize: 14
    }
  })
)(TableCell);

【讨论】：