React Native 元件之TextInput

React Native 元件之TextInput類似于iOS中的UITextView或者UITextField，是作為一個文字輸入的元件,下面的TextInput的用法和相關屬性。

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51

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