React Native 組件之TextInput類似於iOS中的UITextView或者UITextField,是作為一個文字輸入的組件,下面的TextInput的用法和相關屬性。
/**
* Sample React Native App
* https://github.com/facebook/react-native
* 周少停 2016-09-16
* TextInput 常用屬性
*/
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);
