移动跨平台框架ReactNative输入组件TextInput【09】

输入组件 TextInput 就是让用户输入数据的，比如输入登录有户名，输入登录密码。

除了简单的单行输入框外，还可以用于输入大量的文本，比如输入用户反馈，输入用户说明等等。

可以说，React Native 中的输入组件 TextInput 是 HTML 中的 和 的结合体。

React Native - 输入组件 TextInput

---

TextInput 组件是 React Native 的内置组件，不需要做额外的安装

引入组件

要使用输入组件 TextInput，必须先引入

import { TextInput } from ‘react-native’

使用语法

输入组件 TextInput 是一个可视组件，使用语法如下

<TextInput

style = {styles}

underlineColorAndroid = “{transparent|”

placeholder = “Email”

placeholderTextColor = “{#9a73ef}”

numberOfLines={1}

editable={true|false}

keyboardType={“default”|“number-pad”|“decimal-pad”|

“numeric”|“email-address”|“phone-pad”}

secureTextEntry={true|false}

multiline={true|false}

returnKeyType = {“done”|“go”|“next”|“search”|“send”}

autoCapitalize = “none”

onChangeText = {function(text){}}/>

看起来属性有点多，我们挑几个通用的常用的做个介绍

| 属性 | 类型 | 说明 |

| — | — | — |

| style | style | 用于定制组件的样式 |

| underlineColorAndroid | color | Android 中下划线的颜色，透明则为 transparent |

| placeholder | stri