材质的UI:本机采用选择深色主题在Windows浏览器,当有白色背景上的白色文本

问题描述 投票:1回答:2

当使用从材质的UI本土选择是否使用深色主题然后选择下拉具有白色背景上的白色文本。

这被认为是该组件演示页面上过当在黑暗模式:

enter image description here

你可以改变的下拉背景颜色不改变实际选择背景颜色?

编辑:这已被记录为一个问题:https://github.com/mui-org/material-ui/issues/14337

reactjs material-ui
2个回答
0
投票

更新内容的3.9.2版本中,这个问题已被固定在材料的UI所以下面的解决办法是不再必要。

这也许应该固定在材料的UI,但你可以在特定用例以下修正:

使用主题来指定选项背景色(见How to change select box option background color?):

const styles = theme => ({
  select: {
    "& option": {
      background: theme.palette.background.paper
    }
  }
});

然后使用类上的选择:

  <Select native className={classes.select}>

下面是使用该演示的修改版本:

Edit 2vq8w4nnjn


0
投票

显然,它的东西,应该固定在包中。

然而,我发现,它使用本地qazxsw POI标记时才会发生。此代码,如果从他们的问题的演示:

<option>

所以,你有两个选择:

  1. 你可以风格的CSS qazxsw POI和覆盖qazxsw POI或 <Select native value={this.state.age} onChange={this.handleChange('age')} inputProps={{ name: 'age', id: 'age-native-simple', }} > <option value="" /> <option value={10}>Ten</option> <option value={20}>Twenty</option> <option value={30}>Thirty</option> </Select> 到你想要的任何东西。
  2. 您可以使用倒置的情况下,他们在另一个演示中使用效果很好的材料UI另一个组件。 (使用option),就像这样: background

观看完整例如fontcolor。 (从材料的UI MenuItem两者)

© www.soinside.com 2019 - 2024. All rights reserved.