看官方文档https://material-ui.com/customization/color/#color,对颜色的使用以及引用都有讲解。
遇到的问题:色调的颜色出不来。
解决之后的代码贴出来:
import React from 'react';
import './App.css';
import Button from '@material-ui/core/Button';
import { makeStyles, createMuiTheme,createStyles, Theme ,ThemeProvider} from '@material-ui/core/styles';
import { deepOrange} from '@material-ui/core/colors';
const useStyles = makeStyles((theme: Theme) =>
createStyles({
margin: {
margin: theme.spacing(1),
},
}),
);
const theme = createMuiTheme({
palette: {
primary: deepOrange,
secondary: {
main: '#ff8a65',
},
},
});
const App: React.FC = () => {
const classes = useStyles();
return (
<div>
<ThemeProvider theme={theme}>
<Button variant="contained" size="medium" color="secondary" className={classes.margin}>
添加菜单
</Button>
<Button variant="contained" size="medium" color="primary" className={classes.margin}>
刷新
</Button>
</ThemeProvider>
<div>
</div>
</div>
);
}
export default App;
效果图:
注意:看button代码的不同的部分