react-native - 如何更改占位符颜色 React Native RNPickerSelect

标签 react-native

我正在使用这个包https://www.npmjs.com/package/react-native-picker-select

我尝试了多种方法来更改 RNPickerSelect 的颜色占位符文本。但他们都没有奏效。

尝试了以下方法:

style = {
  {
    inputIOS: {color: Constants.colour.black},
    inputAndroid: {color: Constants.colour.black},
    placeholderColor: Constants.colour.grey_90,
  }
}
placeholder = { 
  label: placeholderText, 
  value: null, 
  color: Constants.colour.grey_90 
};

更新:

对于Android,您应该像这样在样式比例中设置占位符颜色,希望我可以帮助某人:):
    style={{
            placeholder: {color: Constants.colour.grey_50},
            inputIOS: { color: Constants.colour.black },
            inputAndroid: { color: Constants.colour.black },
          }}

最佳答案

如果包主页中没有示例,我建议您首先查看包的 github 存储库中的问题板。您可能在那里找到了解决方案。
本期您将得到答案https://github.com/lawnstarter/react-native-picker-select/issues/100 .

这是示例代码:

            <RNPickerSelect
                placeholder={{
                    label: 'Select a color...',
                    value: null,
                }}
                placeholderTextColor="red"
                items={this.state.items}
                onValueChange={(value) => {
                    this.setState({
                        favColor: value,
                    });
                }}
                onUpArrow={() => {
                    this.inputRefs.name.focus();
                }}
                onDownArrow={() => {
                    this.inputRefs.picker2.togglePicker();
                }}
                style={{ ...pickerSelectStyles }}
                value={this.state.favColor}
                ref={(el) => {
                    this.inputRefs.picker = el;
                }}
            />

关于react-native - 如何更改占位符颜色 React Native RNPickerSelect,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59147467/

相关文章:

javascript - 语法错误意外 token ,React Native

reactjs - react 导航我 requireNativeComponent : "RNSScreenStackHeaderConfig"

ios - super 表达式必须为 null 或函数

javascript - 如何以正确的顺序显示日期? ( react native )

ios - react native : component on top of another component

javascript - react 原生 : Stack Navigator mode ='card' or mode ='modal' is not working (expo project)

javascript - if 语句中的 setState() 问题

reactjs - react native : Passing props between components and componentWillMount() method

javascript - Android React Native 应用程序在 getUserMedia WebRTC 调用时崩溃

react-native - Realm Javascript 是否支持 Join、Group By 和 Aggregation 功能