nuke-text-input

TextInput

• category: Components
• chinese: 输入框
• type: 基本

---

何时使用

TextInput 是唤起用户输入的基础组件。 当定义 multiline 输入多行文字时其功能相当于 textarea。

API

属性	说明	类型	默认值
multiline【即将废弃】	定义该属性文本框可以输入多行文字	boolean	false
multiple	定义该属性文本框可以输入多行文字	boolean	false
accessibilityLabel	为元素添加标识	string	无
autoComplete	添加开启自动完成功能	boolean	false//todo
autoFocus	添加开启获取焦点	boolean	false
editable	文本框是否可编辑	boolean	true
keyboardType【即将废弃】	设置弹出哪种软键盘 可用的值有default ascii-capable numbers-and-punctuation url number-pad phone-pad name-phone-pad email-address decimal-pad twitter web-search numeric	string	default
type	设置弹出哪种软键盘 可用的值有text url password tel date time email	string	text
maxLength	设置最大可输入值	number	无
maxNumberOfLines	当文本框为mutiline时设置最多的行数	number	无
numberOfLines	同上设置行数	number	无
placeholder	设置文本框提示	string	无
password【即将废弃】	文本框内容密码显示
secureTextEntry【即将废弃】	同上文本框内容密码显示
value	文本框的文字内容	string	无
style	自定义样式	Object	无

同时 TextInput 响应下面几个事件：

• onBlur: 文本框失焦时调用此函数。onBlur={() => console.log('失焦啦')}
• onFocus: 文本框获得焦点时调用此函数
• onChange: 文本框内容变化时调用此函数
• onInput: 文本框输入内容时调用此函数

使用示例：

<TextInput
        placeholder="Enter text to see events"
        autoFocus multiline
        onFocus={() => console.log('onFocus')}
        onBlur={() => console.log('onBlur')}
        onInput={() => console.log('onInput')}
        style={{
                width: '1000rem',
                height: '1000rem',
                borderWidth:'1rem',
                borderStyle:'solid',
                borderColor:'#cccccc'
        }}
/>