导入-import Grid from '@mui/material/Grid';
+import Grid from '@mui/material/Unstable_Grid2';
复制已复制(或 $keyC)
移除属性item 和 zeroMinWidth 属性已在 Grid v2 中删除
-
+
复制已复制(或 $keyC)
负边距如果您想应用类似于 Grid v1 的负边距,请在网格容器上指定 disableEqualOverflow={true}。要应用于所有网格,请将默认属性添加到主题
import { createTheme, ThemeProvider } from '@mui/material/styles';
import Grid from '@mui/material/Unstable_Grid2';
const theme = createTheme({
components: {
MuiGrid2: {
defaultProps: {
// all grids under this theme will apply
// negative margin on the top and left sides.
disableEqualOverflow: true,
},
},
},
});
function Demo() {
return (
);
}
复制已复制(或 $keyC)
使用 Material UI v6Grid v2 在 Material UI v6 中标记为稳定版本,因此删除了 Unstable_ 前缀
-import Grid from '@mui/material/Unstable_Grid2';
+import Grid from '@mui/material/Grid2';
复制已复制(或 $keyC)
随着稳定化的进行,API 也得到了改进。您可以在 Material UI v6 升级指南中查看更改以及有关如何迁移的更多详细信息。
最后,原始 Grid 组件已被弃用,将来将被删除,因此我们强烈建议您迁移到 Grid v2。
文档页面查看 Grid v2 文档以获取所有演示和代码示例。