早上好，
我爱上了 Material UI，它可以做很多事情。然而，在广泛使用它之后，我注意到，当 Material UI Divider 是 Container 或 Paper 组件的子组件时，它不会显示。我找不到任何关于为什么会出现这种情况的信息，所以这可能是我的实现。有人可以检查一下并看看为什么它没有出现吗？
一切都是导入的，Popover 工作正常。
谢谢你！
navBarPopover: {
display: "flex",
flexDirection: "column",
alignItems: "center",
justifyContent: "center"
}
<Popover
id={id}
open={open}
anchorEl={anchorEl}
onClose={handleClose}
anchorOrigin={{
vertical: "top",
horizontal: "right",
}}
transformOrigin={{
vertical: "top",
horizontal: "right",
}}
>
<Container className={clsx(classes.navBarPopover)}>
<Button className={clsx(classes.loginButton)} component={Link} to="/user_auth" onClick={() => handleClose()}>
Login
</Button>
<Divider />
<Button className={clsx(classes.loginButton)} component={Link} to="/faqs" onClick={() => handleClose()}>
FAQs
</Button>
</Container>
</Popover>
我同意，Material-UI 真的很棒。
在本期中，您将给予display:'flex'到父容器。通过给flex，子元素的最小可能宽度为flex-shrink默认情况下存在于子元素上。
所以，这里Divider存在但其宽度为 0。将宽度提供为 100%。
<Divider style={{width:'100%'}} />
在这里查看演示：-https://codesandbox.io/s/happy-euler-2ycv4 https://codesandbox.io/s/happy-euler-2ycv4
编辑：2023 年 2 月
正如@Lesik2008 中提到的comment https://stackoverflow.com/questions/65568238/why-does-my-mui-divider-not-show-up-in-a-mui-container-or-paper/65572655#comment128255155_65572655， 您可以使用flexItemprop 也表明这是弹性项目，它会相应地计算高度。经过flexItem as true.
更小更干净。
<Divider flexItem />
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
