React NativeTextInput占位符不可见

bq9c1y66  于 2023-01-27  发布在  React
关注(0)|答案(7)|浏览(168)

我正在制作一个简单的屏幕,其中只包含一个带占位符的TextInput,但占位符显示在屏幕上。
我的组件:

render() {
  <TextInput
    placeHolder="placeholder"
  />
}

index.js:

export default () => {
  <MyComponent />
}

将TextInput Package 到View中没有帮助。

0ejtzxu1

0ejtzxu11#

看起来您将属性placeholder拼错为placeHolder。请参见https://facebook.github.io/react-native/docs/textinput.html#placeholder。

pnwntuvh

pnwntuvh2#

有些人像我一样,可能会忘记他们没有使用默认的颜色。请确保您调整了placeholderTextColor属性以对比您的背景色

bqucvtff

bqucvtff3#

像这样尝试

render() {
  <TextInput
    placeholder="placeholder text"
  />
}

像这样你可以测试你的组件

<TextInput
          style={styles.textEdit}
          onChangeText={(text) => this.setState({text})}
          placeholder="add text here to see in place holder"
        />

把这个加进去

textEdit: {
    height: 40, 
    borderColor: 'grey', 
    backgroundColor: 'white',
    borderWidth: 1
  },
thigvfpy

thigvfpy4#

您的拼写错误

placeholder='Sreach' (correct)

如果不起作用,则需要检查placeholderTextColor
有时候你背景颜色和占位保持器颜色是一样的

ztigrdn8

ztigrdn85#

这完全是因为占位符-〉占位符的拼写错误。

render() {
  <TextInput
    placeholder="placeholder text"
  />
}
2vuwiymt

2vuwiymt6#

注意“占位符”文本大小写。它应该始终是“小写字母

eiee3dmh

eiee3dmh7#

放置属性placeholderTextColor并设置颜色。深色模式将颜色替换为白色

相关问题