README.zh-CN.md

English | 简体中文

react-native-textarea

React Native textarea component

运行效果

安装和使用

1. 使用npm安装:

$ npm install --save react-native-textarea

2. 导入组件:

import Textarea from 'react-native-textarea';

3. 使用组件:

...
<View style={styles.container}>
  <Textarea
    containerStyle={styles.textareaContainer}
    style={styles.textarea}
    onChangeText={this.onChange}
    defaultValue={this.state.text}
    maxLength={120}
    placeholder={'好玩有趣的，大家同乐，伤感忧闷的，大家同哭。。。'}
    placeholderTextColor={'#c7c7c7'}
    underlineColorAndroid={'transparent'}
  />
</View>
...

const styles = StyleSheet.create({
  container: {
    flex: 1,
    padding: 30,
    justifyContent: 'center',
    alignItems: 'center',
  },
  textareaContainer: {
    height: 180,
    padding: 5,
    backgroundColor: '#F5FCFF',
  },
  textarea: {
    textAlignVertical: 'top',  // hack android
    height: 170,
    fontSize: 14,
    color: '#333',
  },
});

API

Textarea

属性	说明	类型	默认值
maxLength	最大长度	number	0
containerStyle	组件样式	Object	-

更多 Textarea 属性请参考 react-native TextInput