如何在React Native中更改文本输入的文本颜色？

Question

输入的占位符是绿色，但我也想输入绿色的文本（当我键入文本时，文本颜色显示为黑色，这在我的UI中不够明显）。我如何也可以使其绿色？

Answer 1

如果要更改 TextInput 颜色，请在样式中添加颜色。

下面的示例将 TextInput 颜色设置为蓝色：

export default class UselessTextInput extends Component {
  constructor(props) {
    super(props);
    this.state = { text: 'Useless Placeholder' };
  }

  render() {
    return (
      <TextInput
        style=
        {{
          height: 40, borderColor: 'gray', borderWidth: 1, color : "blue"
        }}
        onChangeText={(text) => this.setState({text})}
        value={this.state.text}
      />
    );
  }
}

Answer 2

添加color: 'green';您的TextInput样式会改变颜色

<TextInput style={styles.textInput} />

const styles = StyleSheet.create({
 textInput: {
  color: 'green',
 },
});`

在native-base您还需要注意主题查看文档

Answer 3

只需为您的输入创建一个样式并将颜色设置为绿色

const styles = StyleSheet.create({
    textInputStyle: {
    color: 'green',
    }
});

并将其分配给您的 textInput

<TextInput 
    style={styles.textInputStyle}
    placeholderTextColor='green'
    underlineColorAndroid='green' />