终极版形式：上handleSubmit

Question

访问状态和形状值I具有以下Redux的形式（6.5.0）的源代码：

class MyForm extends Component { 
 

 
\t handleSubmit() { 
 
    \t \t console.log("Inside the handleSubmit of the MyForm Component where state is accessible", this.state.MyStateElement); 
 
\t } 
 

 
\t function render() { 
 
\t \t return (
 
    \t \t <<<< \t CHOICE 1: >>>> 
 
     <form onSubmit={handleSubmit(this.handleSubmit.bind(this))} > 
 

 
    \t \t <<<< \t CHOICE 2: >>>> 
 
     <form onSubmit={handleSubmit(submit)}> 
 

 
\t \t \t \t {someFields} 
 
\t \t \t </form> 
 
\t \t); 
 
\t } 
 
} 
 

 
function submit(values) { 
 
\t console.log("submit function outside the MyForm Component where form values are accessible but the State is NOT accessible", values); 
 
\t // values correspond to every checkbox, radio button inside MyForm 
 
}

有一个MyForm的组件。它内部有一个简化形式。现在在反应组件中定义了一个handleSubmit（）函数。在反应组件外部定义了一个submit（）函数。现在我可以为表单标签启用CHOICE 1或CHOICE 2定义。如果我启用第一个，则会调用反应组件内的handleSubmit。在这里，我可以访问this.state，但无法访问表单中的各个字段（除非我可以手动将每个字段映射到全局状态，对于我拥有的几十个字段，我无法明确地做到这一点） 。如果启用CHOICE 2，则所有字段的值都正确地进入submit函数。但是我无法访问submit函数中的this.state。

我的问题是：有没有办法获得字段值以及this.state在handleSubmit /提交功能？

Answer 1

好吧，我找到了一个解决方案（不知道这是否是最好的）。我只需要将values参数添加到handleSubmit函数中。所以更新的来源将是：

​​

Answer 2

另一种解决办法是......

1）当你与reduxForm包裹表单组件指定onSubmit选项。

class myForm extends React.Component {} 
 

 
export default reduxForm({ 
 
    form: 'myForm', 
 
    onSubmit: function(values) { console.log('hello', values) } 
 
})(myForm);

2），此功能可用内部组件作为this.props.handleSubmit所以你仍然可以编写自己的提交处理程序，并调用this.props.handleSubmit里面。

class myForm extends React.Component { 
 
    myOwnSubmitHanlder() { 
 
    console.log('hello', this.state); 
 
    this.props.handleSubmit() 
 
    } 
 
    
 
    render() { 
 
    return (
 
     <form onSubmit={this.myOwnSubmitHanlder}></form> 
 
    ) 
 
    } 
 
}