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

/**
* Sample React Native App
* https://github.com/facebook/react-native
* 周少停 2016-09-16
* TextInput 常用属性
*/ import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
TextInput,
View
} from 'react-native'; class Project extends Component {
render() {
return (
<View style={styles.container}>
<TextInput style={styles.inputStyle}
//value={'我是默认的'} /*该文字无法删除*/
keyboardType = {'number-pad'} //弹出键盘类型
multiline = {true} //多行显示,默认false:单行显示
// password = {true} //密码 多行文本不显示密码
placeholder = {'我是占位文字'} //占位文字
placeholderTextColor = 'red' //占位文字颜色
autoCapitalize = {'characters'} //通知文本输入自动利用某些字符
clearButtonMode = {'always'} //右侧的清除模式
autoCorrect = {false} //禁用自动校正 默认值true开启自动校正
// editable = {false} // 是否可编辑 默认为true可编辑
// retrunKeyType = {'go'} //返回键类型
/>
</View>
);
}
} const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#F5FCFF',
},
inputStyle:{
height:60,
marginTop:20,
borderWidth:1,
borderColor:'black'
}
}); AppRegistry.registerComponent('Project', () => Project);

  完整源码下载:https://github.com/pheromone/React-Native-1

React Native 组件之TextInput的更多相关文章

  1. beeshell —— 开源的 React Native 组件库

    介绍 beeshell 是一个 React Native 应用的基础组件库,基于 0.53.3 版本,提供一整套开箱即用的高质量组件,包含 JavaScript(以下简称 JS)组件和复合组件(包含 ...

  2. React Native组件(二)View组件解析

    相关文章 React Native探索系列 React Native组件系列 前言 了解了RN的组件的生命周期后,我们接着来学习RN的具体的组件.View组件是最基本的组件,也是首先要掌握的组件,这一 ...

  3. 从零学React Native之11 TextInput

    TextInput 组件是用来通过键盘输入文字,可以使用View组件和Text组件样式,没有自己特定的样式. 与Text组件类似,TextInput组件内部的元素不再使用FlexBox布局,而采用文本 ...

  4. React Native组件之Text

    React Native组件之Text相当于iOS中的UILabel. 其基本属性如下: /** * Sample React Native App * https://github.com/face ...

  5. React Native组件之Switch和Picker和Slide

    React Native组件Switch类似于iOS中的UISwitch:组件Slide类似于iOS中UIslider,组件Picker类似于iOS的UIPickerView.他们的使用方法和相关属性 ...

  6. react native组件的生命周期

    react native组件的生命周期 一.当页面第一次加载时,会依次调用: constructor() componentWillMount(): 这个函数调用时机是在组件创建,并初始化了状态之后, ...

  7. react native组件的创建

    react native组件的创建 react文件加载顺序: react项目启动后,先加载index.js.在index.js中可以指向首页. import { AppRegistry } from ...

  8. React Native组件(三)Text组件解析

    相关文章 React Native探索系列 React Native组件系列 前言 此前介绍了最基本的View组件,接下来就是最常用的Text组件,对于Text组件的一些常用属性,这篇文章会给出简单的 ...

  9. Android React Native组件的生命周期及回调函数

    熟悉android的童鞋应该都清楚,android是有生命周期的,其很多组件也是有生命周期.今天小编和大家分享的React Native组件的生命周期,还不了解的童鞋,赶紧来围观吧 在android开 ...

随机推荐

  1. 初学java之面板布局的控制

    /* * 联系网格的布控laytout *以一个棋盘为列子吧! */ import javax.swing.*; import java.awt.*; class WindGrid extends J ...

  2. 关于SQL语句优化的一个问题

    今天写了一个很简单的存储过程,结果一执行,40多秒,后来调整了一句话写法,瞬间出来,其实差别不大,如下: select item_no=vpc.ITEM_ID ,BL_QTY=sum(vpc.QTY_ ...

  3. SVG格式

    SVG格式 编辑 目 录 概述 简介 优势 实例 展现 1概述 SVG格式 SVG是一种用XML定义的语言,用来描述二维矢量及矢量/栅格图形.SVG提供了3种类型的图形对象:矢量图形(vectorgr ...

  4. php -l 检查文件是否语法错误

    有时候在进行网页开发的时候,后台文件的语法错误比较难检查出来,这时候使用php -l filename可对文件的语法进行检查.

  5. Neo4j图数据库简介和底层原理

    现实中很多数据都是用图来表达的,比如社交网络中人与人的关系.地图数据.或是基因信息等等.RDBMS并不适合表达这类数据,而且由于海量数据的存在,让其显得捉襟见肘.NoSQL数据库的兴起,很好地解决了海 ...

  6. word 转 PDF时报错

    利用微软自带的com组件,把word转化成Pdf,利用vs2012调试时没有问题,但是发布到IIS时出错,错误为: 检索 COM 类工厂中 CLSID 为 {} 的组件时失败,原因是出现以下错误: 8 ...

  7. InLineHookSSDT

    //当Ring3调用OpenProcess //1从自己的模块(.exe)的导入表中取值 //2Ntdll.dll模块的导出表中执行ZwOpenProcess(取索引 进入Ring0层) //3进入R ...

  8. uva 10491

    https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem& ...

  9. bzoj 2330: [SCOI2011]糖果

    #include<cstdio> #include<iostream> using namespace std; ],next[],u[],v[],h,t,a[]; ],f[] ...

  10. 编绎openssl杂记(window)

    Window 下 OpenSSL 编绎过程 1. 下载 ActivePerl-5.12.4.1205  , openssl-0.9.8 , 配置Perl环境变量 , 解压openssl-0.9.82. ...