Question

AutoComplete使用Menu呈现MenuItems，如这些页面上的文档所示。

我需要更改悬停的MenuItem的backgroundColor。我可以使用＆＃34; menuItemStyle＆＃34;更改所有项目的颜色。它需要一个样式对象，但我不确定悬停样式的语法在Material-UI样式对象中是什么。

Answer 1

他们仍在使用hoverColor，这可能在列表项中。但暂时你可以使用这些道具

<MenuItem 
  primaryText="MenuItem"
  onMouseEnter={(e) => e.target.style.backgroundColor= 'red'}
  onMouseLeave={(e) => e.target.style.backgroundColor = '#ffffff'}/>

这可能会暂时解决您的问题。

Answer 2

在根目录上应用悬停样式应该做到这一点。

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

如何在AutoComplete道具悬停更改时更改Material-UI MenuItem背景？

2 个答案: