Material-UI withStyles未应用背景色

Question

我使用withStyles来应用背景线性渐变（在container中的styles对象中），效果很好，但是我遵循相同的格式在styles中创建了另一个对象，命名为child将背景色应用于的子元素，但没有任何反应。为什么不应用背景色？

import { Grid } from '@material-ui/core';
import { withStyles } from '@material-ui/core/styles';

const styles = {
  container: {
    display: 'flex',
    alignItems: 'center',
    height: '100vh',
    background: 'linear-gradient(45deg, #aa6775 30%, #984355 90%)' // Works
  },

  child: {
    backgroundColor: 'yellow' // Does nothing
  }
};

class App extends Component {

  render() {
    return (
      <Grid
        id="quote-box"
        className={this.props.classes.container}
        justify="center"
        container
      >
        <Grid xs={11} lg={8} className={this.props.classes.child} item>
          .....
        </Grid>
      </Grid>
    );
  }
}

export default withStyles(styles)(App);

Answer 1

我使用Create React App创建了一个项目，并运行了您的代码，它似乎运行良好。也许您正在运行旧版本的Material？

作为参考，这里是我的依赖项：

"dependencies": {
    "@material-ui/core": "^4.2.0",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "3.0.1"
  },