属性名
取值
说明
clearButtonMode
enum(‘never', ‘while-editing', ‘unless-editing', ‘always')
何时在文本框右侧显示清除按钮
clearTextOnFocus
bool
如果为true,每次开始输入的时候都会清除文本框的内容
keyboardAppearance
enum(‘default', ‘light', ‘dark')
键盘的颜色
onKeyPress
function
一个键被按下的时候调用此回调,传递给回调函数的参数为{ nativeEvent: { key: keyValue } }
spellCheck
bool
如果为false,则禁用拼写检查的样式(比如红色下划线)
enablesReturnKeyAutomatically
bool
如果为true,键盘会在文本框内没有文字的时候禁用确认按钮 ,默认值为false
3 方法
clear()
clear用于清空输入框的内容。
想要使用组件的方法则需要使用组件的引用,例子如下所示。
... render() { return ( <View style={styles.container}> <View style={styles.searchBar}> <TextInput style={styles.input} ref="textInputRefer" placeholder='请输入内容' blurOnSubmit={true} returnKeyType='send' onChangeText={(text) => { this.setState({searchText: text}); }} /> <Button style={styles.button} title='清除' onPress={ () => { this.refs.textInputRefer.clear(); } }/> </View> </View> ); } ...
在TextInput标签中定义引用的名称:ref="textInputRefer",这样我们通过 this.refs.textInputRefer就可以得到TextInput 组件的引用。在Button的onPress函数中,调用了TextInput的clear方法,这样当我们点击“清除”按钮时,文本框中的内容就会被清除。
isFocused(): boolean
返回值表明当前输入框是否获得了焦点。
好了,到这里TextInput组件就介绍到这里,还有一些没有列出的属性请查看官方文档。希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
您可能感兴趣的文章: