如何在material ui版本5中使用react-admin

Question

如何使用Material UI版本5中的react-admin。有可能使它独立于材料ui 4吗?

Answer 1

您需要使用最新的主题和遗留主题。遗留主题应该在Admin组件上设置，最新主题应该通过ThemeProvider设置。

MUI v5和MUI v4。X在基本的默认主题方面并没有太大的不同。考虑到有些东西被移走了还有一两把钥匙被移走了。您可以创建一个对象作为全局主题(包含排版、调色板、断点等，如果您自定义这些值)。

v5中的一个关键区别。X和v4。X是定义组件的样式覆盖和默认道具的方式。您将需要创建一个函数来遍历所有themeV4. components，并获取defaultProps和styleOverrides中的值，并将它们分配到themeV4下。

import { ThemeProvider } from '@mui/material/styles';
import { createTheme } from '@mui/material/styles';
import { createTheme as createThemeV4 } from '@material-ui/core/styles';
const theme = {
sidebar: {...},
palette: {...},
typography: {...},
}
let latestTheme = createTheme({
...theme,
components: {},
});
let legacyTheme = createThemeV4({
...theme,
overrides: {},
props: {},
});
<ThemeProvider theme={latestTheme}>
<Admin
title={APP_NAME}
authProvider={authProvider}
dataProvider={dataProvider}
i18nProvider={i18nProvider}
history={history}
theme={legacyTheme}
>
{resources}
</Admin>
</ThemeProvider>

Answer 2

看起来React-Admin的下一个主要版本(4)增加了对MUI v5的支持

Answer 3

他们发布了使用mui 5的react-admin v4