TextInput组件允许用户在应用中通过键盘输入文本信息,其使用方法和Text、Image一样简单,实例代码如下:

<TextInput placeholder={'请输入用户名'} style={styles01.inputStyle} underlineColorAndroid={'transparent'}/>
<TextInput placeholder={'请输入密码'} secureTextEntry={true} style={styles01.inputStyle} underlineColorAndroid={'transparent'}/>

  TextInput组件的属性如下表:

名称 作用 平台
autoCapitalize 自动切换成大写 enum(‘none’,’sentences’,’words’,’characters’) none:不自动切换任何字符成大写;sentences:默认每个句子的首字母变成大写;words:每个字母的首字母变成大写;characters:每个字母全部变成大写 iOS、Android
autoCorrent 设置拼写自动修正功能,默认为开启(true) bool iOS、Android
autoFocus 设置是否默认获取到焦点,默认为关闭(false),componentDidMount方法被调用之后才会获取焦点(componentDidMount是React组件被渲染之后React系统回调的方法) bool iOS、Android
defaultValue 给文本输入设置一个默认初始值 string iOS、Android
editable 设置文本框是否可以编辑 bool iOS、Android
keyboardType 键盘类型:用来选择默认弹出键盘的类型,例如指定numeric就是弹出数字键盘。 ‘default’, ‘email-address’, ‘numeric’, ‘phone-pad’, ‘ascii-capable’, ‘numbers-and-punctuation’, ‘url’, ‘number-pad’, ‘name-phone-pad’, ‘decimal-pad’, ‘twitter’, ‘web-search’,鉴于平台的原因如下的值是所有平台都可以进行通用:default,numeric,email-address iOS、Android
maxLength 限制文本输入框最大的输入字符长度 number iOS、Android
multiline 设置可以输入多行文字,默认为false(表示无论文本输入多少,都是单行显示) bool iOS、Android
onBlur 监听方法,文本框失去焦点回调方法 function iOS、Android
onChange 监听方法,文本框内容发生改变回调方法 function iOS、Android
onChangeText 监听方法,文本框内容发生改变回调方法,该方法会进行传递文本内容 function iOS、Android
onEndEditing 监听方法,当文本结束文本输入回调方法 function iOS、Android
onFocus 监听方法 文本框获取到焦点回调方法 function iOS、Android
onLayout 监听方法 组价布局发生变化的时候调用,调用方法参数为 {nativeFunction:{x,y,width,height}} function iOS、Android
onSelectionChange 监听方法 当Text input选中状态被改变时调用 function iOS、Android
onSubmitEditing 监听方法,当编辑提交的时候回调方法。不过如果multiline={true}的时候,该属性就不生效 function iOS、Android
placeholder 当文本输入框还没有任何输入的时候,默认显示信息,当有输入的时候该值会被清除 string iOS、Android
placeholderTextColor 设置placeholderText颜色 string iOS、Android
returnKeyType 决定return键怎么显示 enum(‘done’, ‘go’, ‘next’, ‘search’, ‘send’, ‘none’, ‘previous’, ‘default’, ‘emergency-call’, ‘google’, ‘join’, ‘route’, ‘yahoo’)。双平台适用:done、go、next、search、send;Android:none、previous;iOS:default、emergency-call、google、join、route、yahoo iOS、Android
secureTextEntry 设置是否为密码安全输入框 bool,默认为false iOS、Android
selectTextOnFocus 如果为true,当获得焦点,自动选中所有文本 bool iOS、Android
selectionColor 输入框文本的高亮颜色(iOS中包括光标) string iOS、Android
value  组件中的值 string iOS、Android
numberOfLines 设置TextInput的行数,multiline设置为true,并结合该属性能够满足多行的TextInput number Android
returnKeyLabel 设置return键为文本组件,利用它替换returnKeyType string android
underlineColorAndroid 设置TextInput的下划线颜色 string android
clearButtonMode 清除按钮模式,设置何时应该在TextInput右边出现清除按钮 enum(‘never’, ‘while-editing’, ‘unless-editing’, ‘always’) iOS
clearTextOnFocus 如果为true,当编辑开始自动清除TextInput文本内容 bool iOS
enablesReturnKeyAutomatically 如果为true,当没有输入文本键盘的return键自动失效,当输入文本键盘的return键自动生效,默认值是false bool iOS
keyboardAppearance 设置键盘的颜色 enum(‘default’, ‘light’, ‘dark’) iOS
onKeyPress 当任何一个键被按时调用,被按的键的值作为一个实参传入function,在onChange被调用之前先执行 function iOS
selectionState 请看DocumentSelectionState.js一些状态负责维持一个文档的选中信息(我也不懂什么意思,官网翻译的。) DocumentSelectionState iOS

  TextInput组件还有如下方法:

isFocused() :判断当前的TextInput组件是否获取了焦点。

clear() :清空TextInput组件中的文本内容。

【RN - 基础】之TextInput使用简介的更多相关文章

  1. J2EE基础之Web服务简介

    J2EE基础之Web服务简介 1.什么是Web服务? 在人们的日常生活中,经常会查询网页上某城市的天气信息,这些信息都是动态的.实时的,它是专业的气象站提供的一种服务.例如,在网上购物时,通常采用网上 ...

  2. Java基础-JVM调优策略简介

    Java基础-JVM调优策略简介 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.JVM结构分析 1>.JVM结构图 2>.JVM运行时数据区功能说明 JVM管理的内 ...

  3. Django 06 Django模型基础1(ORM简介、数据库连接配置、模型的创建与映射、数据的增删改查)

    Django 06 Django模型基础1(ORM简介.数据库连接配置.模型的创建与映射.数据的增删改查) 一.ORM系统 #django模型映射关系 #模型类-----数据表 #类属性-----表字 ...

  4. Spring Boot 基础,理论,简介

    Spring Boot 基础,理论,简介 1.SpringBoot自动装配 1.1 Spring装配方式 1.2 Spring @Enable 模块驱动 1.3 Spring 条件装配 2.自动装配正 ...

  5. 【RN - 基础】之Image使用简介

    Image组件是用来加载图片的.React Native项目加载图片往往有三种方式: 从React Native项目中加载图片: 从APP项目中加载图片: 从网络中加载图片. Image组件加载图片 ...

  6. 【RN - 基础】之View使用简介

    简介 View是一个容器,支持FlexBox布局. View既可以作为容器容纳其他组件,也可以作为一个组件包含进另一个容器中. 无论运行在哪个平台上,View都会直接对应这个平台的原生视图,如iOS中 ...

  7. 【RN - 基础】之Text使用简介

    基本用法 Text组件是React Native中的一个重要组件,相当于iOS中的UILabel和Android中的TextView.Text组件用来存放文本数据.下面是一个简单的例子: import ...

  8. 爬虫基础(五)-----scrapy框架简介

    ---------------------------------------------------摆脱穷人思维 <五> :拓展自己的视野,适当做一些眼前''无用''的事情,防止进入只关 ...

  9. python 基础 10.0 nosql 简介--redis 连接池及管道

    一. NOSQL 数据库简介 NoSQL 泛指非关系型的数据库.非关系型数据库与关系型数据库的差别 非关系型数据库的优势: 1.性能NOSQL 是基于键值对的,可以想象成表中的主键和值的对应关系,而且 ...

随机推荐

  1. spring cloud 2.x版本 Feign服务发现教程(内含集成Hystrix熔断机制)

    前言 本文采用Spring cloud本文为2.1.8RELEASE,version=Greenwich.SR3 本文基于前两篇文章eureka-server和eureka-client的实现. 参考 ...

  2. zookeeper+springboot+dubbo简单实现

    第一步:在虚拟机中搭建zookeeper. 第二步:本地创建3个maven工程,分别为wxh-dubbo-api(对外暴露的接口),wxh-dubbo-provider(服务提供者,接口的具体实现), ...

  3. forEach,map,every,some,filter简单用法实例

    平时简单总结:不足之处还望见谅: 实例: 11.1 forEach:只能进行取值操作,不能进行修改 arr.forEach(function(element,index,arr){});//注意参数: ...

  4. CAT客户端如何从Apollo中读取配置?

    运行环境 以下就是这个示例的运行环境,如果版本号不一样,区别也应该不会很大,可以根据实际情况做相应调整. JDK 8 spring boot 2.0.7.RELEASE cat-client 3.0. ...

  5. [开源] gnet: 一个轻量级且高性能的 Golang 网络库

    Github 主页 https://github.com/panjf2000/gnet 欢迎大家围观~~,目前还在持续更新,感兴趣的话可以 star 一下暗中观察哦. 简介 gnet 是一个基于 Ev ...

  6. [专题总结]矩阵树定理Matrix_Tree及题目&题解

    专题做完了还是要说两句留下什么东西的. 矩阵树定理通俗点讲就是: 建立矩阵A[i][j]=edge(i,j),(i!=j).即矩阵这一项的系数是两点间直接相连的边数. 而A[i][i]=deg(i). ...

  7. 消息中心 - Laravel的Redis队列(一)

    前言 Laravel的队列可以用在轻量级的队列需求中.比如我们系统中的短信.邮件等功能,这些功能有一些普遍的特征,异步.重试.并发控制等.Laravel现在主要支持的队列服务有Null.Sync.Da ...

  8. SSM整合案例--用户登录

    实现用户登录案例,并进行非法拦截 实现当用户未登录时,无法跳转到出登录页面以外的任何页面,拦截用户仍在登陆页面:当用户登录成功即可跳转到其他页面 (1)导入依赖 <!-- https://mvn ...

  9. Unity - Cinemachine实现相机抖动

    普通相机抖动脚本较易实现,但在使用cinemachine相机下,其Transform组件不可被代码改变,那么Cinemachine的相机抖动如何实现呢?本文结合实际项目,对实现相机抖动的三大步骤进行系 ...

  10. Matlab 文件格式化/Matlab Source File Formator

    由于需要使用到别人编写的Matlab代码文件,但是呢不同的人有不同的风格,有的写得就比较糟糕了. 为了更好地理解代码的内容,一个比较美观的代码会让人身心愉悦. 但是在网上并没有找到一个比较好的实现,此 ...