解
import createMuiTheme, { Theme, ThemeOptions } from "@material-ui/core/styles/createMuiTheme";import { Palette } from "@material-ui/core/styles/createPalette";interface IPalette extends Palette { xxx: {}}interface ITheme extends Theme { palette: IPalette;}interface IThemeOptions extends ThemeOptions { palette: IPalette;}const theme = createMuiTheme({ palette: { ... xxx: {} // Type been checked }} as IThemeOptions) // Use customized ThemeOptions typeconst useStyles = makeStyles((theme: ITheme) => ({ // Use customized Theme type root: { color: theme.palette.xxx // Work with no type error }}));参考
如果我们看一下createMuiTheme.d.ts
import { Palette, PaletteOptions } from './createPalette';export interface ThemeOptions { palette?: PaletteOptions; ...}export interface Theme { palette: Palette; ...}export default function createMuiTheme(options?: ThemeOptions, ...args: object[]): Theme;我们会发现这一点，
Theme并
ThemeOptions发挥不同的作用。
- 主题：返回类型
- ThemeOptions：参数类型
