javascript - 如何将 props 值传递给 React Native 中的表单字段?

标签 javascript reactjs react-native textinput

我有这个表单代码:

<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,prop 值是一个整数。

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

最佳答案

value={this.state.package_select}

当您通过 props 传递 package_select 时,这一行是错误的。它必须是:

value={this.props.package_select}

还要记住,当您将 props 从外部传递到输入字段时,您就拥有了一个受控组件。您无法在值更改时更改该组件的内部状态。因此,当选择输入更改时,您可以通过调用的 props 在此组件上注册回调。

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

关于javascript - 如何将 props 值传递给 React Native 中的表单字段?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46742269/

相关文章:

javascript - 为什么 Apple 将匿名脚本加载到我的 Web 应用程序中?

javascript - 以下 javascript 语法是什么意思?

ios - CFBundleIdentifier”,不存在

css - 如何让 'Reactjs Modal'出现在屏幕上从右到中飞

android - react-native-router-flux 禁用 android 后退按钮返回登录屏幕

node.js - 即使在建立 Websocket 之后,Socket IO 仍保持(重新?)连接

javascript - 我想在 angularjs 中为我的倒数计时器添加暂停按钮

javascript - 呈现随机数据集

javascript - react native : How to switch page without using NavigatorIOS component?

javascript - React.js 中的相对导入