react native TextInput控件相关问题集锦

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/NotesChapter/article/details/80085514

问题一： 输入框下划线不消失问题
1. 产生问题的场景： 在 android环境下 textinput 存在下划线情况

1. 解决办法：在TextInput 标签下添加 underlineColorAndroid = ‘transparent’ 属性
   <TextInput style = {styles.user_input} underlineColorAndroid = 'transparent' value = {'请输入您的用户名'}/>

---

问题二：输入框输入类型

1. 情景：不同业务输入框输入类型不同
2. 解决办法：
   密码类型：

<TextInput sourceTextEntry = {true} value = {'输入密码'} />

其他类型

{/*默认输入框*/}
<TextInput style={styles.textInputStyle1}/>
{/*设置初始值*/}
<TextInput style={styles.textInputStyle1} defaultValue="我是输入框" />
{/*设置placehold*/}
<TextInput style={styles.textInputStyle1} placeholder="我是输入框 placehold" />
{/*设置占位符颜色*/}
<TextInput style={styles.textInputStyle1} placeholder="我是输入框 placehold" placeholderTextColor="red"/>
{/*设置键盘类型*/}
<TextInput style={styles.textInputStyle1} placeholder="设置键盘类型" keyboardType="number-pad" />
{/*文本输入可以输入多行*/}
<TextInput style={styles.textInputStyle1} multiline={true} />
{/*文本是不可编辑*/}
<TextInput style={styles.textInputStyle1} placeholder="文本是不可编辑" editable={false} />
{/*密文*/}
<TextInput style={styles.textInputStyle1} placeholder="密文" secureTextEntry={true} />
{/*设置最大字数*/}
<TextInput style={styles.textInputStyle1} placeholder="设置最大字数" maxLength={10} />

---

问题三： 默认占位值及其颜色问题
1. 很多情况下 输入框需要 填充默认占位值，通常情况下输入框输入前和输入后颜色不一样，因此我们可以设置 他的color 和 value
2. <TextInput placeholder = {'默认占位值' placeholderColor = '#99999'}
3. 问他解决