redux-form - onSubmit doesnt work

Question

나는 redux-form을 사용하고 있습니다. 나는 그저 onSubmit 기능을 사용하지 않습니다.

편집 : 제 문제는 함수가 호출되지 않는 것입니다. 디버거를 onSubmit에 넣으면 거기에 도달하지 못합니다. 여기 내 양식이다

class userForm extends Component { 
    onSubmit(values) { // do here something } 
    render() { 
     const { handleSubmit } = this.props; 
     return <form onSubmit={handleSubmit(this.onSubmit)}> 
      <Field name='id' 
       component={TextField} 
       label='id'/> 
      <Field name='name' 
       component={TextField} 
       label='name' /> 
      <button type='submit'>Submit</button> 
     </form> 
    } 
} 

export default reduxForm({ 
    form: 'userForm' 
})(userForm); 

그러나 그것은 결코 태그의 onsubmit 방법에 도달하지 않습니다.

내가 뭘 잘못하고 있니?

Answer 1

이것은 내가 사용하는 패턴의 편집 된 버전입니다.

bind 키워드를 사용합니다.

일반적으로 나는 redux를 사용하여 상태를 관리하고, handleFormSubmit 함수 내에서 작업을 사용합니다. 그러나 이것은 당신을 올바른 길로 인도해야합니다.

import React, { Component } from 'react'; 
import { reduxForm } from 'redux-form'; 

class Userform extends Component { 

    static handleFormSubmit({ id, name}) { 
    console.log({id, name}); 
    } 

    render() { 
    const { handleSubmit, fields: { id, name }} = this.props; 
    return(
     <form onSubmit={handleSubmit(Userform.handleFormSubmit.bind(this))}> 
     <fieldset> 
      <label>Id:</label> 
      <input {...id}/> 
     </fieldset> 
     <fieldset> 
      <label>Name:</label> 
      <input {...name} /> 
     </fieldset> 
     <button action="submit">Submit</button> 
     </form> 
    ); 
    } 
} 


export default reduxForm({ 
    form: 'userform', 
    fields: ['id', 'name'] 
})(Userform); 

Answer 2

제출하지 않으려면 onSubmit을 사용해야합니다.

export default class Form extends Component { 
    static propTypes = { 
    ... 
    } 

    submit(data) { 
    console.log(data); 
    } 

    render() { 
    return (
     <form action="" method="post" onSubmit={this.props.handleSubmit(this.submit)}> 
     ... 
     </form> 
    ); 
    } 
}