2017-01-16 140 views

回答

22

是的。它被称为TextInput,正常的TextInput组件支持多行。

只需指定下列属性的TextInput组件

multiline = {true} 
numberOfLines = {4} 

在最后你应该有这样的:

<TextInput 
    multiline={true} 
    numberOfLines={4} 
    onChangeText={(text) => this.setState({text})} 
    value={this.state.text}/> 
2

我使用这个组件: https://www.npmjs.com/package/react-native-autogrow-textinput

它扩展自动上文字的增长。我创建了自动增长-的TextInput我自己的可重用组件作为它的一部分,该组件内部看起来像这样:

<AutoGrowingTextInput 
    minHeight={40} 
    maxHeight={maxHeight} // this is a flexible value that I set in my 
    component, where I use this reusable component, same below, unless 
    specified the other 
    onChangeText={onChangeText} 
    placeholder={placeholder} 
    placeholderTextColor='#C7C7CD' 
    style={inputStyle} 
    value={value} 
/> 
0

如果您正在使用才反应过来,本地组件的选项TextInput

至于“ funkysoul”解释说:

只需指定下列属性的TextInput组件

multiline = {true}
numberOfLines = {4}

如果你想看到这个组件作为经典textarea(比嵌入式文本输入更大),通常你会需要添加height样式属性。请看下面的例子:

<TextInput 
    multiline={true} 
    numberOfLines={10} 
    style={{ height:200, backgroundColor:'red'}} 
/> 

我加入的backgroundColor为更好地理解height作用。请不要在您的项目中使用它;)