redux-form onSubmit-Funktion nicht feuern

Question

Ich habe viele Möglichkeiten, dies zu tun und haben sogar eine HOC und änderte es zu einer Klasse Komponente. Ich habe die wenigen Möglichkeiten ausprobiert, die ich gesehen habe, wie zum Beispiel den Aufruf von handleSubmit mit der Requisite. Ich benutze Redux-Tools und ich bin es gewohnt, etwas wie submit_failed oder submit_success zu sehen, aber ich sehe das nicht und ich weiß nicht, warum die onSubmit-Funktion nicht ausgelöst wird. Hier ist ein Beispiel für eine der Möglichkeiten, wie ich es tat, wo ich das einfache Beispiel in redux-Form Dokumentationen folgen:

import React from 'react'; 
import { Field, reduxForm } from 'redux-form'; 
import { Form, Button, Grid } from 'semantic-ui-react'; 
import { Link } from 'react-router-dom'; 
import {connect} from 'react-redux'; 
import {bindActionCreators} from 'redux'; 
import {signup} from '../../actions/user-actions'; 
import { required, minValue7, email, renderField } from '../helpers/validations'; 


let SignupForm = (props) => { 
    const { handleSubmit } = props.signup; 
    return (
     <Grid centered columns={2}> 
     <Grid.Column className="home"> 
      <Form className="forms" onSubmit={ handleSubmit }> 
      <Form.Field inline> 
       <Field 
       name="username" 
       component={renderField} 
       type="text" 
       placeholder="Username" 
       label="Username" 
       validate={[required]} 
       /> 
      </Form.Field> 

      <Form.Field inline> 
       <Field 
       name="email" 
       component={renderField} 
       type="email" 
       placeholder="Email" 
       label="Email" 
       validate={[required, email]} 
       /> 
      </Form.Field> 

      <Form.Field inline> 
       <Field 
       name="password" 
       component={renderField} 
       type="password" 
       placeholder="Password" 
       label="Password" 
       validate={[required, minValue7]} 
       /> 
      </Form.Field> 
      <Link to={'/signup2'}> 
       <Button type="submit">Save</Button> 
      </Link> 
      </Form> 
     </Grid.Column> 
     </Grid> 

) 
} 

SignupForm = reduxForm({ 
    form: 'form1' 
})(SignupForm) 

const mapStateToProps = (state, ownProps) => { 
return { 
    userSignup: state.userSignup 
} 
} 

const mapDispatchToProps = (dispatch) => { 
return bindActionCreators({signup}, dispatch) 
} 

export default connect(mapStateToProps, mapDispatchToProps)(SignupForm) 

Auch habe ich es versucht, wo ich const {handleSubmit} = props tun und ändern Sie dann `` `onSubmit = {handleSubmit (this.props.signup)}

Answer 1

Ich endete mit meiner Taktik der Verwendung der Klassensyntax mit Hilfe von @Mister Epic gehen musste die Umleitung vor der Aktion stattfand.

import React from 'react'; 
import { Field, reduxForm } from 'redux-form'; 
import { Form, Button, Grid } from 'semantic-ui-react'; 
import { required, minValue7, email, renderField } from '../helpers/validations'; 


class SignupForm extends React.Component { 
    constructor(props) { 
    super(props); 
    this.submit = this.submit.bind(this); 
    } 

    submit(values) { 
    this.props.signup(values) 
    this.props.history.push('/form2') 
    } 

    render() { 
    return (
     <Grid centered columns={2}> 
      <Grid.Column className="home"> 
      <Form className="forms" onSubmit={ this.props.handleSubmit(this.props.submit) }> 
       <Form.Field inline> 
       <Field 
        name="username" 
        component={renderField} 
        type="text" 
        placeholder="Username" 
        label="Username" 
        validate={[required]} 
       /> 
       </Form.Field> 

       <Form.Field inline> 
       <Field 
        name="email" 
        component={renderField} 
        type="email" 
        placeholder="Email" 
        label="Email" 
        validate={[required, email]} 
       /> 
       </Form.Field> 

       <Form.Field inline> 
       <Field 
        name="password" 
        component={renderField} 
        type="password" 
        placeholder="Password" 
        label="Password" 
        validate={[required, minValue7]} 
       /> 
       </Form.Field> 
       <Button type="submit">Save</Button> 
      </Form> 
      </Grid.Column> 
     </Grid> 

    ) 
    } 

} 

SignupForm = reduxForm({ 
    form: 'form1' 
})(SignupForm) 


export default SignupForm