首页 > 解决方案 > 我无法在 REACT 中使用 Material UI 构建此布局

问题描述

我无法编码以粉红色圆圈突出显示的中间布局

我想要的布局

我想让这个布局在 materialUi 中做出反应

标签: reactjslayoutmaterial-ui

解决方案


我不确定你在问什么,但我希望这会对你有所帮助

有不同的方法可以做你想做的事情,但我认为保持正确的网格顺序很重要。

在我看来,在粉红色圆圈内,您忘记将卡片包装在网格项目组件中,这将使您可以按照您想要的方式对齐卡片。

我做了一个超级简单的例子来更好地解释我的观点: https ://codesandbox.io/s/material-demo-forked-6ylvv

在容器内部,您还可以决定与 direction="column" 对齐并使用 xs={6}.. 这取决于您,在 Material-UI 文档中您可以找到不同的方法,我建议您花更多时间在它并记住始终使用容器内的项目


推荐阅读