首页 > 解决方案 > 在本机反应中使用 NativeBase textArea

问题描述

嗨所以我想要一个 textArea 以便让用户在我的应用程序中发送评论消息。那么如何检索用户使用组件编写的消息呢?

  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>

    );
  }

我希望能够获得用户的电子邮件和消息。谢谢 !

标签: react-nativenative-base

解决方案


Native-base 输入是 react-native TextInput 组件的扩展,这就是你可以使用onChangeText事件的原因。对于您的示例,假设我们的状态中有两个元素,电子邮件和消息。{email: "", message: ""}

我们需要为两个输入添加一个 onChangeText 事件,如下所示:

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

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

现在您可以使用this.state.email和检索用户编写的文本this.state.message

请在React-native TextInput处理文本输入的官方 react-native 文档中阅读有关处理文本输入的更多信息


推荐阅读