How do I change Material-UI MenuItem background on hover change from AutoComplete props?

Viewed 4057

AutoComplete uses Menu to render MenuItems as shown in the docs on those pages.

I need to change the backgroundColor of the hovered MenuItem. I am able to change color of all items by using "menuItemStyle" which expects a style object but I'm not sure what the syntax for hover style is in the Material-UI style objects.

2 Answers

Applying hover style on root should do it.

const MyMenuItem = withStyles({
  root: {
    '&:hover': {
      backgroundColor: 'red !important',
      color: 'blue'
    }
  }
})(MenuItem)
Related