Как переопределить материал-интерфейс MenuItem выбранного цвета фона?

Question

В настоящее время я борюсь с установкой цвета фона компонента MenuItem, который выбран другим цветом.(без необходимости! важно заставить его)

Код компонента:

<MenuItem
 classes={{
  root: this.props.classes.root,
  selected: this.props.classes.selected
 }}
 value={10}>
  Alfabetical
</MenuItem>

Это css:

const homePageStyle = (theme) => ({
  root: {
    width: "300px"
  },
  selected: {
    backgroundColor: "turquoise !important",
    color: "white",
    fontWeight: 600
  }
});

Чего я хочу достичь?

Я бы хотел установить backgroundColor для MenuItem, не устанавливая флаг! Important.Я сделал это с большим количеством компонентов, но в данный момент это не помогает.

Я использую версию "@ material-ui / core": "^ 1.0.0-rc.0",

Спасибо за любую помощь.

Answer 1

Я только что сделал рабочий пример здесь

Чтобы ваш выбранный класс был принят во внимание, вы должны установить для свойства selected вашего MenuItem компонента значение true

<MenuItem
  onClick={this.handleClose}
  selected
  classes={{ selected: classes.selected }}
>