React-native TextInput组件的使用

下面我给大家介绍一些React-native TextInput的组件的属性:

TextInput组件

在一个应用程序中,输入框是必不可少的,比如 “搜索”功能是大部分应用程序都拥有的。TextInput是可以通过键盘将文本输入到App的组件,它提供了比较丰富的功能,例如自动校验、占位符以及指定弹出不同的键盘类型等。

TextInput组件介绍

我们期待TextInput能帮助我们做更多的事情,而不是我们去模拟一些事件和属性。ReactNative在TextInput做的还是很好的,属性和事件基本够用。我们既可以用TextInput组件做基本的组件,也可以用TextInput组件做自动补全的搜索功能。TextInput的主要属性和事件如下所示:

autoCapitalize: 枚举类型,可选值有'none'、'sentences' 、'words'、'characters'。当用户输入时,用于提示。

placeholder: 占位符,在输入前显示的文本内容。

value: 文本输入框的默认值。

placeholderTextColor: 占位符文本的颜色。

password: 如果为true,则是密码输入框,文本显示为 "*"。

multiline: 如果为true,则是多行输入。

editable: 如果为false,文本框不可输入。其默认值是true。

autoFocus: 如果为true,将自动聚焦。

clearButtonMode: 枚举类型,可选值有'never'、'while-editing'、'unless-editing'、'always'。用于显示清除按钮。

maxLength: 能够输入的最长字符数。

enablesReturnKeyAutomatically: 如果值为true,表示没有文本时键盘是不能有返回键的。其默认值为false。

returnKeyType: 枚举类型,可选值有 'default'、 'go'、 'google' 、'join'、 'next'、'route'、 'search'、 'send'、 'yahoo'、'done'、'emergency-call'。表示软键盘返回键显示的字符串 。

secureTextEntry:如果为true,则像密码框一样隐藏输入内容。默认值为false。

onChangeText:当文本输入框变化时,调用该函数。onChangeText接受一个文本的参数对象。

onChange: 当文本变化时,调用该函数。

onEndEditing: 当结束编辑时,调用该函数。

onBlur: 失去焦点触发事件。

onFocus: 获取焦点触发事件。

onSubmitEditing: 当结束编辑后,点击键盘的提交按钮触发该事件。


这些就是TextInput的属性了。希望小二提供的有所帮助。

你可能感兴趣的:(React-native TextInput组件的使用)