What is an alternative of textarea in react-native?

Is there any built in text area component for react-native? I have tried to implement these ones:

https://github.com/buildo/react-autosize-textarea

https://github.com/andreypopp/react-textarea-autosize

but getting an error "Expected a component class got object object".

Yes there is. It's called TextInput, the normal TextInput Component supports multiple lines.

Just assign following properties to your TextInput Component

multiline = {true}
numberOfLines = {4}

At the end you should have this:

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

Source https://facebook.github.io/react-native/docs/textinput

If you want to see your TextInput component like a textarea, you will need to add this

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

I build text areas in react-native by wrapping a TextInput component into a View the following way:

  <View style={styles.textAreaContainer} >
    <TextInput
      style={styles.textArea}
      underlineColorAndroid="transparent"
      placeholder="Type something"
      placeholderTextColor="grey"
      numberOfLines={10}
      multiline={true}
    />
  </View>

...

const styles = StyleSheet.create({
  textAreaContainer: {
    borderColor: COLORS.grey20,
    borderWidth: 1,
    padding: 5
  },
  textArea: {
    height: 150,
    justifyContent: "flex-start"
  }
})

I am using this component: https://www.npmjs.com/package/react-native-autogrow-textinput

It expands automatically on-text growth. I created my own reusable component with the autogrow-textinput as part of it, which inside the component looks like that:

<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}
/>

If you are using only react-native components your option is TextInput

As "funkysoul" explained:

>Just assign following properties to your TextInput Component > >multiline = {true}
>numberOfLines = {4}

If you want to see this component as the classic textarea (bigger than an inline text-input), you usually will need to add the height style-property. See the following example:

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

I added the backgroundColor for a better understanding of the height role. Please don't use it on your project ;)