如何将道具值传递给反应原生的表单字段？答案

【问题标题】：How to pass props value to form field in react native?如何将道具值传递给反应原生的表单字段？
【发布时间】：2017-10-14 07:59:31
【问题描述】：

我有这个表格代码：

<Form>
    <Item floatingLabel last>
      <Label>Email</Label>
      <Input onChangeText={ (text)=> this.setState({email: text}) }
       />
    </Item>
    <Item floatingLabel last>
      <Label>Mobile</Label>
      <Input onChangeText={ (text)=> this.setState({reg_mob_no: text}) }
         />
    </Item>
    <Item disabled floatingLabel last>
      <Label>Package : {this.props.package_name}</Label>
      <Input disabled onChange={(text) => this.setState({package_select:this.props.package_id}) }
   />
    </Item>
    <Item floatingLabel last>
      <Label>Password</Label>
      <Input onChangeText={ (text)=> this.setState({password: text}) }
         secureTextEntry={true}/>
    </Item>
    <View padder>
        <Button block style={{ backgroundColor:"#FF69B4" }} onPress={this.onRegisterPressed.bind(this)} >
            <Text>Submit</Text>
          </Button>
    </View>  
  </Form>

我想将props 值传递给package_select 表单字段。this.props.package_id 是道具，道具值是整数。

我将如何将 prop 值传递给表单字段？

【问题讨论】：

标签： javascript reactjs react-native textinput

【解决方案1】：

value={this.state.package_select}

当你通过 props 传递 package_select 时，这一行是错误的。必须是：

value={this.props.package_select}

另外请记住，当您将道具从外部传递到输入字段时，您有一个受控组件。您无法在值更改时更改该组件的内部状态。 So you register a callback on this component via props that is called, when the select input changes.

阅读并理解：https://reactjs.org/docs/uncontrolled-components.html

【讨论】：