材质 UI 列表项文本：主要文本溢出

Question

抱歉，如果有人问这个问题，我查了一下，找不到答案！

我有一个具有设定宽度的 Material UI 列表视图（位于侧边栏中）。我正在尝试呈现某些选项的标题，并且 ListItemText 的主要文本正在环绕其容器。为什么不简单地延长容器的高度并走向多行呢？

提前非常感谢！

return (
            <ListItem
              key={network._id}
              selected={user.network && user.network._id === network._id}
            >
              <ListItemText
                primary={network.name}
                sx={{ maxWidth: '100%' }}
              />
              <IconButton>
                <DoubleArrowIcon />
              </IconButton>
            </ListItem>
          );

Answer 1

全部，

如果您遇到我的问题，这对我有用：

<ListItemText 
    primary={tooLongTitle} 
    primaryTypographyProps={{ style: { whiteSpace: "normal" } }} />

信用： 多行与

Answer 2

简单

<ListItemText primary="a title" primaryTypographyProps={{ noWrap: true }} />