將樣式應用到 materialui 組件

Question

`

 import React, { Component } from 'react'; import Header from './Components/UI/header'; import { Box, Paper } from '@material-ui/core'; import { ThemeProvider, withStyles} from '@material-ui/core/styles'; const styles = () => ({ overrides: { 'MuiPaper-root': { root: { backgroundColor: '#345f', } } } }); export class App extends Component { render() { const classes = this.props; return(<ThemeProvider theme={theme}> <Paper classes={classes.overrides}> <Box display="flex" justifyContent="center" alignItems="center" height={1}> <Header /> </Box> </Paper> </ThemeProvider>); } } export default withStyles(styles)(App);

`項目 img 鏈接

我正在嘗試將不同的背景顏色應用於紙張 api 組件。 當我運行代碼時，它會生成相同的基本樣式。

Answer 1

您無需擔心 MUI 生成的樣式或根。 這將設置您本地<Paper />組件的背景

const styles = () => ({
  overrides: {
     backgroundColor: '#345f',
  }
});