TextInput是一個允許用戶在應用中通過鍵盤輸入文本的基本組件。本組件的屬性提供了多種特性的配置，譬如自動完成、自動大小寫、占位文字，以及多種不同的鍵盤類型（如純數字鍵盤）等等。它的樣式屬性跟Text是一樣；
一：屬性
1：autoCapitalize enum('none', 'sentences', 'words', 'characters')
控制TextInput是否要自動將特定字符切換為大寫：
characters: 所有的字符。
words: 每個單詞的第一個字符。
sentences: 每句話的第一個字符（默認）。
none: 不自動切換任何字符為大寫。
2：autoCorrect bool
如果為false，會關閉拼寫自動修正。默認值是true。
3：autoFocus bool
如果為true，在componentDidMount后會獲得焦點。默認值為false。
4：blurOnSubmit bool
如果為true，文本框會在提交的時候失焦。對於單行輸入框默認值為true，多行則為false。注意：對於多行輸入框來說，如果將blurOnSubmit設為true，則在按下回車鍵時就會失去焦點同時觸發onSubmitEditing事件，而不會換行。
5：defaultValue string
提供一個文本框中的初始值。當用戶開始輸入的時候，值就可以改變。
在一些簡單的使用情形下，如果你不想用監聽消息然后更新value屬性的方法來保持屬性和狀態同步的時候，就可以用defaultValue來代替。
6：editable bool
如果為false，文本框是不可編輯的。默認值為true。
7：keyboardType enum("default", 'numeric', 'email-address', "ascii-capable", 'numbers-and-punctuation', 'url', 'number-pad', 'phone-pad', 'name-phone-pad', 'decimal-pad', 'twitter', 'web-search')
決定彈出的何種軟鍵盤的，譬如numeric（純數字鍵盤）。
這些值在所有平台都可用：
default
numeric
email-address
maxLength number
限制文本框中最多的字符數。使用這個屬性而不用JS邏輯去實現，可以避免閃爍的現象。
8：multiline bool
如果為true，文本框中可以輸入多行文字。默認值為false。
9：onBlur function
當文本框失去焦點的時候調用此回調函數。
10：onChange function
當文本框內容變化時調用此回調函數。
11：onChangeText function
當文本框內容變化時調用此回調函數。改變后的文字內容會作為參數傳遞。
12：onEndEditing function
當文本輸入結束后調用此回調函數。
13：onFocus function
當文本框獲得焦點的時候調用此回調函數。
14：onLayout function
當組件掛載或者布局變化的時候調用，參數為{x, y, width, height}。
15：onSubmitEditing function
此回調函數當軟鍵盤的確定/提交按鈕被按下的時候調用此函數。如果multiline={true}，此屬性不可用。
16：placeholder string
如果沒有任何文字輸入，會顯示此字符串。
17：placeholderTextColor string
占位字符串顯示的文字顏色。
18：secureTextEntry bool
如果為true，文本框會遮住之前輸入的文字，這樣類似密碼之類的敏感文字可以更加安全。默認值為false。
19：selectTextOnFocus bool
如果為true，當獲得焦點的時候，所有的文字都會被選中。
20：selectionColor string
設置輸入框高亮時的顏色（在iOS上還包括光標）
21：value string
文本框中的文字內容。
TextInput是一個受約束的(Controlled)的組件，意味着如果提供了value屬性，原生值會被強制與value屬性保持一致。在大部分情況下這都工作的很好，不過有些情況下會導致一些閃爍現象——一個常見的原因就是通過不改變value來阻止用戶進行編輯。如果你希望阻止用戶輸入，可以考慮設置editable={false}；如果你是希望限制輸入的長度，可以考慮設置maxLength屬性，這兩個屬性都不會導致閃爍。
22：iosclearButtonMode enum('never', 'while-editing', 'unless-editing', 'always')
是否要在文本框右側顯示“清除”按鈕。
23：（ios）clearTextOnFocus bool
如果為true，每次開始輸入的時候都會清除文本框的內容。
24：（ios）enablesReturnKeyAutomatically bool
如果為true，鍵盤會在文本框內沒有文字的時候禁用確認按鈕。默認值為false。
25：（ios）keyboardAppearance enum('default', 'light', 'dark')
指定鍵盤的顏色。
26：（ios）onKeyPress function
當一個鍵被按下的時候調用此回調。被按下的鍵會作為參數傳遞給回調函數。會在onChange之前調用。
27：（ios）returnKeyType enum('default', 'go', 'google', 'join', 'next', 'route', 'search', 'send', 'yahoo', 'done', 'emergency-call')
決定“確定”按鈕顯示的內容。
28：（ios）selectionState DocumentSelectionState
參見DocumentSelectionState.js，可以控制一個文檔中哪段文字被選中的狀態。
29：（android）numberOfLines number
設置輸入框的行數。當multiline設置為true時使用它，可以占據對應的行數。
30：（android）underlineColorAndroid string
文本框的下划線顏色(譯注：如果要去掉文本框的邊框，請將此屬性設為透明transparent)。
二：方法
1：isFocused(): boolean
返回值表明當前輸入框是否獲得了焦點。
2：clear()
清空輸入框的內容。
三：實例代碼
import React, { Component } from 'react'; import { AppRegistry, StyleSheet, AlertIOS, Text, View, TextInput, Alert } from 'react-native'; class ReactNativeProject extends Component { myOnChangeText(newText) { console.log('inputed text:' + newText); alert(newText); } render() { return ( <View style={styles.container}> <TextInput keyboardType="numeric" placeholder="請輸入用戶名" style={styles.inputTextTopStyle} clearTextOnFocus={true}/> <TextInput keyboardType="default" style={styles.inputTextCenterStyle} returnKeyType="next" maxLength={5} defaultValue="默認值" clearButtonMode="always"/> <TextInput autoFocus={true} defaultValue="自動獲取焦點" style={{marginTop:30,height:30,borderWidth:1,borderColor:'red'}} onChangeText={this.myOnChangeText}/> <TextInput multiline={true} style={styles.inputTextBottomStyle} defaultValue="多行文本輸入框"/> <TextInput secureTextEntry={true} style={styles.inputTextCenterStyle} defaultValue="123456" editable={false}></TextInput> <TextInput style={styles.inputTextCenterStyle} defaultValue="失焦點響應事件" onBlur={() => AlertIOS.prompt('Secure Text', null, null, 'secure-text')}></TextInput> </View> ); } } const styles = StyleSheet.create({ container: { flex: 1, marginTop:64 }, inputTextTopStyle:{ height:20, borderWidth:1, borderColor:'blue', marginLeft:15, marginRight:15 }, inputTextCenterStyle: { marginTop:10, marginLeft:15, borderColor:'red', borderWidth:1, height:25 }, inputTextBottomStyle:{ marginTop:20, marginLeft:15, borderColor:'red', borderWidth:1, height:45 } }); AppRegistry.registerComponent('ReactNativeProject', () => ReactNativeProject);
效果圖：
最近有個妹子弄的一個關於擴大眼界跟內含的訂閱號，每天都會更新一些深度內容，在這里如果你感興趣也可以關注一下(嘿對美女跟知識感興趣)，當然可以關注后輸入：github 會有我的微信號，如果有問題你也可以在那找到我；當然不感興趣無視此信息；
