我怎样才能改变React-native-picker中下拉菜单的背景颜色并且无法改变它（当前显示灰色）。那我该怎么办？

Question

我无法更改react-native-picker中下拉菜单的背景颜色，其当前显示为灰色。我正在使用 https://www.npmjs.com/package/@react-native-picker/picker

Answer 1

你尝试过吗

style={{ backgroundColor: "red" }} // Or whatever color you like..

像这样

<Picker
  selectedValue={selectedLanguage}
  style={{ backgroundColor: "red" }}
  onValueChange={(itemValue, itemIndex) =>
    setSelectedLanguage(itemValue)
  }>
  <Picker.Item label="Java" value="java" />
  <Picker.Item label="JavaScript" value="js" />
</Picker>

Answer 2

对于下拉菜单，您需要更改Picker.Item。这是我使用 NativeWind 构建的亮/暗模式颜色完成的实现：

<Picker
  style={{color: primaryTextColor}}
  dropdownIconColor={pickerArrowColor}
  mode={'dropdown'}
  selectedValue={product?.productType ?? ''}
  onValueChange={(value: string) => updateProduct({productType: value})}>
  {productTypeOptions.map((option: string) => (
      <Picker.Item key={option} label={option} value={option} style={{backgroundColor: primaryBackgroundColor, color: primaryTextColor}} />
  ))}
</Picker>