如何从反应本机元素更改输入中的颜色

Question

我有一个来自反应本机元素的输入，看起来像这样

<Input
    placeholderTextColor={constants.inputPlaceholderFontColor}
    inputContainerStyle={{marginTop: 30, borderBottomColor: constants.dimmedFontColor}}
    placeholder='Spieleranzahl'
    keyboardType='numeric'
    leftIconContainerStyle={{marginRight: 10, marginBottom: 8}}
    leftIcon={
        <Icon
           name='user'
           size={ 24 }
           color= {constants.iconColor}/>
    }
    onChangeText={input => this.setState({numberOfPlayers: input})}

我尝试通过

设置颜色

样式={{颜色：'white'}}
inputStyle={{颜色：'white'}}
inputContainerStyle={{颜色：'white'}}

文档说：“这个组件继承了标准 React Native TextInput 元素附带的所有原生 TextInput 道具，以及以下......”所以我不明白为什么样式属性没有工作，因为它适用于标准 TextInput 组件。

此外，文档还提到了 inputStyle：“将传递给 React Native TextInput 的样式道具的样式”因此这也应该有效，因为这是在标准文本组件上设置颜色的方式。

我是不是漏掉了什么？

Answer 1

我已经在 snack.expo 上创建了一个示例，inputStyle 在 iOS 和 Android 上都能完美运行。很可能还有另一个问题，这就是为什么我会建议重新实现我的简单示例并查看它是否有效。

更新：可能只显示您的占位符文本。我在你的代码中看不到你将 value 道具传递给你的输入的地方。

演示:

https://snack.expo.io/Yunjp2ozw

输出：

代码：

export default function App() {
  const [text, setText] = React.useState('Test');
  return (
    <View style={styles.container}>
      <Input 
      value={text}
      onChangeText={(text) => setText(text)}
      inputStyle={{'color': 'red'}}
      />
    </View>
  );
}

如何从反应本机元素更改输入中的颜色

How to change color in Input from react native elements

input

react-native

react-native-elements