React Native 常用組件之 TextInput

一、前言

文本輸入框,相當(dāng)于OC中的UITextField,在用法和屬性方面,兩者都有很大的借鑒之處:通過鍵盤將文本輸入到應(yīng)用程序的一個基本的組件;

二、TextInput的常見屬性

因為TextInput是繼承自UIView,所以View的屬性TextInput也能夠使用,一些樣式類的屬性在學(xué)習(xí)的時候可以參照View的相關(guān)屬性。

  • value (string):文本輸入的默認(rèn)值,不能刪除
  • onChangeText (bool):監(jiān)聽用戶輸入的值:
  • keyboardType 鍵盤類型:決定打開哪種鍵盤,例如,數(shù)字鍵盤。
    enum('default', "ascii-capable", 'numbers-and-punctuation', 'url', 'number-pad', 'phone-pad', 'name-phone-pad', 'email-address', 'decimal-pad', 'twitter', 'web-search', "numeric")
  • multiline (bool):如果值為真,文本輸入可以輸入多行。默認(rèn)值為假。
  • password (bool):如果值為真,文本輸入框就成為一個密碼區(qū)域。默認(rèn)值為假。
  • placeholder (string):在文本輸入之前字符串將被呈現(xiàn)出來,通常被稱為占位文字
  • placeholderTextColor (string):占位符字符串的文本顏色
  • autoCapitalize:可以通知文本輸入自動利用某些字符。enum('none', 'sentences', 'words', 'characters')
  • characters:所有字符,
  • words:每一個單詞的首字母
  • sentences:每個句子的首字母(默認(rèn)情況下)
  • none:不會自動使用任何東西
  • autoCorrect (bool):如果值為假,禁用自動校正。默認(rèn)值為真。
  • autoFocus (bool):如果值為真,聚焦 componentDidMount 上的文本。默認(rèn)值為假。
  • bufferDelay (number):會幫助避免由于 JS 和原生文本輸入之間的競態(tài)條件而丟失字符。默認(rèn)值應(yīng)該是沒問題的,但是如果你每一個按鍵都操作的非常緩慢,那么你可能想嘗試增加這個。
  • clearButtonMode:清除按鈕出現(xiàn)在文本視圖右側(cè)的時機enum('never', 'while-editing', 'unless-editing', 'always')
  • controlled (bool):如果你真想要它表現(xiàn)成一個控制組件,你可以將它的值設(shè)置為真,但是按下按鍵,并且/或者緩慢打字,你可能會看到它閃爍,這取決于你如何處理 onChange 事件。
  • editable (bool):如果值為假,文本是不可編輯的。默認(rèn)值為真。
  • enablesReturnKeyAutomatically (bool):如果值為真,當(dāng)沒有文本的時候鍵盤是不能返回鍵值的,當(dāng)有文本的時候會自動返回。默認(rèn)值為假。
  • onBlur (bool):當(dāng)文本輸入是模糊的,調(diào)用回調(diào)函數(shù)
  • onChange (function):當(dāng)文本輸入的文本發(fā)生變化時,調(diào)用回調(diào)函數(shù)
  • onEndEditing (function):當(dāng)文本編輯結(jié)束時
  • onFocus (function):當(dāng)輸入的文本是聚焦?fàn)顟B(tài)時,調(diào)用回調(diào)函數(shù)
  • returnKeyType:決定返回鍵的樣式 enum('default', 'go', 'google', 'join', 'next', 'route', 'search', 'send', 'yahoo', 'done', 'emergency-call')
  • secureTextEntry (bool):如果值為真,文本輸入框就會使輸入的文本變得模糊,以便于像密碼這樣敏感的文本保持安全。默認(rèn)值為假。
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容