Question

我使简单屏幕只包含一个带占位符的TextInput，但显示占位符。有什么问题？

MyComponent的：

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

index.js：

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

将TextInput包装到View中无济于事。

Answer 1

看起来你把道具placeholder拼错了placeHolder。请参阅https://facebook.github.io/react-native/docs/textinput.html#placeholder。

Answer 2

试试这个

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
  },

Answer 3

完全是因为占位符拼写错误 - ＆gt;占位符。

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

Answer 4

您的拼写错误

placeholder='Sreach' (correct)

如果不起作用，则需要检查placeholderTextColor
有时您的背景色和占位符颜色相同

Answer 5

记下“占位符”文本大小写。整个

都应该是“小写字母”

Answer 6

像我这样的人，可能会来这里忘记他们没有使用默认的颜色。确保调整placeholderTextColor属性以对比背景颜色。

react-native TextInput占位符不可见

6 个答案: