redux-form - onSubmit does not work

我使用的是redux-form，我只是不能讓onSubmit功能工作。redux-form - onSubmit does not work

編輯：我的問題是，該函數沒有被調用，我把調試器上的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方法。

我在做什麼錯？

來源

2016-10-05 Pachu

您可能需要將'fields'屬性添加到您的reduxForm中。看看這裏：https://codepen.io/PiotrBerebecki/pen/PGEGQQ –

我的問題是，該函數沒有被調用，我編輯了我的問題。 – Pachu

您使用哪個版本的反應表單？我已經使用6.0.0，並且當我添加字段屬性時，您的代碼很好：https://codepen.io/PiotrBerebecki/pen/gwoLwB請參閱控制檯 - 函數被調用。 –

這是我使用的模式的編輯版本。

請注意使用bind關鍵字。

通常我使用REDX來管理狀態，並且還會使用函數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);

來源

2016-10-05 12:16:06 alexi2

您需要使用submit not onSubmit。

來源

2016-10-05 20:34:22

redux-form - onSubmit does not work

回答

相關問題