redux-formとserversideのバリデーションを使用してフォームに送信された値を処理するにはどうすればよいですか？

私はRexJSのログインフォームコンポーネントでredux-formを使用しています。しかし、フォームに値を渡したときに、送信ボタンをクリックすると、console.logから返された値は空になり、デバッグ方法はわかりません。は、ここで私はそれが動作する方法を得ることができ、私は送信ボタンをクリックしたときredux-formとserversideのバリデーションを使用してフォームに送信された値を処理するにはどうすればよいですか？

import React, { Component } from 'react'; 
import { connect } from 'react-redux'; 
import { Link, withRouter } from 'react-router-dom'; 
import {reduxForm, Field} from 'redux-form'; 
import classnames from 'classnames' 

// Actions 
import {signin} from '../../actions/auth'; 

// Bootstrap 
import { Grid, Row, Col, Image } from 'react-bootstrap'; 

// Includes 
import '../../assets/css/users/signin.min.css'; 
import logo from '../../assets/images/datazonia_icone.png'; 

const renderField = ({input, label, type, forgotPassword=false, meta: {touched, error}}) =>(
    <div className="form-group"> 
     <label>{label}</label> 
     <input {...input} type={type}/> 
     {forgotPassword && 
     <span className="forgot-pw"> 
      <Link to="https://stackoverflow.com/users/password/reset">mot de passe oublié ?</Link> 
     </span>} 
      {touched && 
      error && 
      <span className="help-block"> 
       {error} 
      </span>} 
    </div>); 

let SigninForm = (props) => { 
    const {handleSubmit, submitting, error } = props; 
    return (
     <form onSubmit={handleSubmit}> 
      <Field 
       name="login" 
       component={renderField} 
       type='text' 
       input={{ 
        className: "form-control" 
       }} 
       label="Email ou nom d'utilisateur" 
      /> 
      <Field 
       name="password" 
       component={renderField} 
       type="password" 
       input={{ 
        className: "form-control" 
       }} 
       label='Mot de passe' 
       forgotPassword 
      /> 
      {error && 
      <strong> 
       {error} 
      </strong>} 
      <button disabled={submitting} type="submit" className="btn btn-block btn-datazonia">Connexion</button> 
     </form> 
    ); 
}; 

SigninForm = reduxForm({ 
    form: 'signin' 
})(SigninForm); 

class UserSignin extends Component { 

    onSubmit = (values) => { 
     console.log(values); 
     return this.props.signin(values, this.props.history, 'users'); 
    }; 

    render() { 
    return (
     <div className="UserSignin"> 
     <Grid> 
      <Row className="show-grid bloc-sign"> 
      <Col sm={4} smOffset={4} xs={12} className="text-center title"> 
       <Link to="/"> 
       <Image src={logo} responsive className="center-block"/> 
       </Link> 
       <h3>Se connecter</h3> 
      </Col> 
      <Col sm={4} smOffset={4} xs={12}> 
       <div className="signin-form"> 
       <SigninForm onSubmit={this.onSubmit}/> 
       </div> 
      </Col> 


      </Row> 
     </Grid> 
     </div> 
    ); 
    } 
} 
UserSignin = connect(null, {signin})(withRouter(UserSignin)); 
export default UserSignin;

私の値が空である私のフォームコンポーネントですか？

（そして、私の英語のため申し訳ありませんが、私はフランス人だ）

出典

2017-09-15 Yohann Ferreira

のデフォルトの動作を上書きします渡され、私は理由を知らない –