今天我想说一下react native中的一个控件,TextInput 翻译过来就是文本输入,对应着android中的EditText。我们先看一下官方是怎样描述的。TextInput是一个允许用户在应用中通过键盘输入文本的基本组件。本组件的属性提供了多种特性的配置,譬如自动完成、自动大小写、占位文字,以及多种不同的键盘类型(如纯数字键盘)等等。具体的我也不多说了,大家可以到官网中看看:http://reactnative.cn/    (中文版的)。

今天我主要是想说的是我当时用这个的时候,遇到一个问题,也许很多人会和我遇到的相同。有时候,我们会遇到这个需求,初始化的时候,textinput需要展示一些内容在输入框中,当然这个和提示语不同,就是要展示一些内容到输入框中,在官网上,textinput中有一个属性value,这个属性就是显示内容到输入框中。而我当时遇到什么问题呢,第一:刚刚开始是获取不到焦点,第二:另一个就是你明明是已经输入值了,可是看不到,但是你可以获取得到你输入的值。很奇怪,后来我是怎么解决的呢,

我先说第一个问题,很简单,主要给这个textinput设置一个宽度就好了。第二个问题是我当时对这个state理解不当造成的。我当时设置的是这样设置的value={this.state.**},导致怎么输入,都是显示原来的值。后面对这个state理解深入一点以后,才知道应该这样设置,才可以value = this.setState{**:**}这种设置方式才成功。

 
												

react native TextInput的更多相关文章

  1. React Native - TextInput详细解说

    1,TextInput组件介绍 TextInput 组件除了作为输入框实现基本的输入功能外,它还提供了许多其他功能,比如自动校验.占位符以及指定弹出不同的键盘类型等. 2,组件的属性 (1)autoC ...

  2. React Native 之 TextInput使用

    前言 学习本系列内容需要具备一定 HTML 开发基础,没有基础的朋友可以先转至 HTML快速入门(一) 学习 本人接触 React Native 时间并不是特别长,所以对其中的内容和性质了解可能会有所 ...

  3. React Native 组件之TextInput

    React Native 组件之TextInput类似于iOS中的UITextView或者UITextField,是作为一个文字输入的组件,下面的TextInput的用法和相关属性. /** * Sa ...

  4. React Native控件只TextInput

    TextInput是一个允许用户在应用中通过键盘输入文本的基本组件.本组件的属性提供了多种特性的配置,譬如自动完成.自动大小写.占位文字,以及多种不同的键盘类型(如纯数字键盘)等等. 比如官网最简单的 ...

  5. react native 封装TextInput组件

    上一篇 react-native文章提到了TextInput组件对安卓的适配问题,因此对该组件进行封装很有必要. 文章地址  react native定报预披项目知识点总结 TextInput介绍 官 ...

  6. React Native之TextInput的介绍与使用(富文本封装与使用实例,常用输入框封装与使用实例)

    React Native之TextInput的介绍与使用(富文本封装与使用实例,常用输入框封装与使用实例) TextInput组件介绍 TextInput是一个允许用户在应用中通过键盘输入文本的基本组 ...

  7. React Native(十三)——ios键盘挡住textInput

    渐入佳境 用React Native重构的项目也快接近尾声,剩下的就是适配ios的功能了.慢慢地也从中琢磨出了一点门道,于是就遇见了键盘遮挡textInput问题斑斑: 正常页面: android点击 ...

  8. [RN] React Native 键盘管理 在Android TextInput遮盖,上移等问题解决办法

    React Native 键盘管理 在Android TextInput遮盖,上移等问题解决办法 解决办法: 打开android工程,在AndroidManifest.xml中配置如下: <ac ...

  9. [React Native]高度自增长的TextInput组件

    之前我们学习了从零学React Native之11 TextInput了解了TextInput相关的属性. 在开发中,我们有时候有这样的需求, 希望输入区域的高度随着输入内容的长度而增长, 如下: 这 ...

随机推荐

  1. java--HashMap多线程并发问题分析

    并发问题的症状 多线程put后可能导致get死循环 从前我们的Java代码因为一些原因使用了HashMap这个东西,但是当时的程序是单线程的,一切都没有问题.后来,我们的程序性能有问题,所以需要变成多 ...

  2. HD2222 Keywords Search(AC自动机入门题)

    然而还不是很懂=_= #include <iostream> #include <cstring> #include <algorithm> #include &l ...

  3. SqlHelper c#

    using System; using System.Data; using System.Xml; using System.Data.SqlClient; using System.Collect ...

  4. 面试题目——《CC150》栈与队列

    面试题3.1:描述如何只用一个数组来实现三个栈. 方法1:固定分割 方法2:弹性分割(较难) package cc150; public class ArrayStack { public stati ...

  5. Android开发环境的搭建

    在学习android时,环境的搭建是学习android的第一步,为了记住第一步特写了这篇文章. 第一步,安装jdk,因为eclipse的运行需要jdk才可以,所以jdk的安装时第一步.安装过程和普通的 ...

  6. [NHibernate]持久化类(Persistent Classes)

    系列文章 [Nhibernate]体系结构 [NHibernate]ISessionFactory配置 引言 持久化类是应用程序用来解决商业问题的类(比如,在电子交易程序中的Customer和Orde ...

  7. golang笔记——函数与方法

    如果你遇到没有函数体的函数声明,表示该函数不是以Go实现的. package math func Sin(x float64) float //implemented in assembly lang ...

  8. [Kerberos] User Ticket Management

    Kerberos客户端常用命令包括 kinit, klist, kdestroy, and kpasswd,用户使用这些命令管理自己的 ticket. 此外,每台运行Kerberos的机器应该都配置/ ...

  9. CSS高效开发实战:CSS 3、LESS、SASS、Bootstrap、Foundation --读书笔记(3)线性渐变

    线性渐变可以设置3个参数值:方向.起始颜色.结束颜色.最简单的模式只需要定义起始颜色和结束颜色,起点.终点和方向默认自元素的顶部到底部.下面举例说明: .test{ background:linear ...

  10. CSS gradient渐变之webkit核心浏览器下的使用

    一.关于渐变 渐变是一种应用于平面的视觉效果,可以从一种颜色逐渐地转变成另外一种颜色,故可以创建类似于彩虹的效果渐变可以应用在任何可以使用图片的地方.例如,您可以指定一个这么一个渐变:顶部的颜色是红色 ...