Question

我正在使用react-select选择下拉列表。我在onchange中获得了所选的选项值。在注册表单上提交数据时，所选选项值始终为空。如何在表单句柄中获取所选选项值提交提交名称和密码。

  class addAtribute extends Component {

        handleFormSubmit({ name, password,role }) {

              this.props.signup({ name, password, role});
       }

  constructor(props){
    super(props);
    this.state={value:''};
   // this.state={};
  }


render(){

    const { handleSubmit, fields: {name, password,role }} = this.props;

    return(
         <form onSubmit={handleSubmit(this.handleFormSubmit.bind(this))}>
            <div className="login" id="login" >
                <div className="col-md-12"> 
                   <input  placeholder="Password" id="pwd" className="login-password form-control" type="password" {...password} />
               <label for="dropdown-custom-1" >Select the Role</label>
                <Select value={this.state.value} options={options} 
                         onChange={event =>                                                                                                       this.setState({value:event.value})} {...role} />       </div>

                                            <button action="submit " className="btn btn-block"><div action="submit" className="login-submit ">Update</div></button>

    );}}


    var options = [
      { value: '1', label: 'Admin'},
      { value: '2', label: 'Manager' },
      { value: '3', label: 'Editor' }];


      function mapStateToProps(state){
           return {auth: state.auth}
      }

       function mapDispatchToProps(dispatch){
           return bindActionCreators({ signup }, dispatch);
       }


         export default reduxForm({
               form: 'signup',
              fields: ['name', 'password','role'},mapStateToProps,mapDispatchToProps)(addAtribute);

Answer 1

你可以简单地写

<form onSubmit={this.handleFormSubmit.bind(this)}>

在react js中发布数据时，所选选项值为空

1 个答案: