如何在资料用户界面版本5中使用react admin

Question

如何使用react与资料UI版本5。它是否可以使它独立于材料ui 4？

Answer 1

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

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

v5.x和v4.x的一个关键区别是如何定义组件的样式重写和默认支持。您将需要创建一个函数来循环所有need 5.组件，并获取defaultProps和styleOverrides中的值，并将它们赋值在themeV4.props和meeV4.overriders下。

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

看起来反应的下一个主要版本(4) -管理添加了对MUI v5的支持