CODEWITHSUNDEEP
react-nativenative-base
Jats1596
Jats1596

Reputation: 1215

Using NativeBase textArea in react native

Hi so I want to have a textArea in order to let the user send a review message in my app. So how can I retrieve the message wrote by the user using this component ? 

  render() {
    return (
      <Container>
        <Content padder>
            <Item style = {{ marginBottom: 10}}>
                <Input placeholder="Email" />
            </Item>
            <Form style = {{ marginBottom: 20}}>
                <Textarea rowSpan={3} bordered placeholder="Votre message" />
            </Form>
            <Button success>
                <Text>Envoyer</Text>
            </Button>
        </Content>

      </Container>

    );
  }

I want to be able to get the email and the message of the user. Thanks !

Upvotes: 0

Views: 3587

Answers (1)

Atef
Atef

Reputation: 1322

Native-base inputs are an extension of the react-native TextInput component, that's why you can use the onChangeText event. For your example let's say we have two elements in our state an email and a message. {email: "", message: ""}

We need to add an onChangeText event to both the inputs as follows:

<Input placeholder="Email" onChangeText={email => this.setState({email: email})} />

and

 <Textarea rowSpan={3} bordered placeholder="Votre message" onChangeText={message=> this.setState({message: message})} />

Now you're able to retrieve the text written by the user using this.state.email and this.state.message

Please read more about handling text inputs in the official react-native documentation in React-native TextInput and in Handling Text Input

Upvotes: 3

Related Questions