title: React Login & Signup Form ant design onFinish not triggering
body: <p>Okay so I have Login.js &amp; Signup.js components
  on the Login component, the onFinish event works perfectly
  where as on Signup the onFinish doesn't work at at all
  -- even not a console.log()</p>
  <p>Login.js (username, password):</p>
  <pre><code>import React from 'react';
  import { LockTwoTone,UserOutlined,LoadingOutlined } from '@ant-design/icons';
  import { Form, Input, Button, Spin } from 'antd';
  import { connect } from 'react-redux';
  import { NavLink } from 'react-router-dom';
  import * as actions from '../store/actions/auth';
  
  const FormItem = Form.Item;
  const antIcon = &lt;LoadingOutlined type=&quot;loading&quot; style={{ fontSize: 24 }} spin /&gt;;
  
  
  class NormalLoginForm extends React.Component {
  handleSubmit = (e) =&gt; {
  console.log(&quot;i am getting printed&quot;);    
  }
  render() {
  let errorMessage = null;
  if (this.props.error) {
      errorMessage = (
          &lt;p&gt;{this.props.error.message}&lt;/p&gt;
      );
  }
  return (
      &lt;div&gt;
          {errorMessage}
          {
              this.props.loading ?
  
              &lt;Spin indicator={antIcon} /&gt;
  
              :
  
              &lt;Form onFinish={this.handleSubmit} className=&quot;login-form col-xs-8&quot;&gt;
                  &lt;FormItem name=&quot;username&quot; rules={[{ required: true, message: 'Please input your Username!' }]}&gt;
                  &lt;Input prefix={&lt;UserOutlined type=&quot;user&quot; style={{ color: 'rgba(0,0,0,.25)' }} /&gt;} placeholder=&quot;Username&quot; /&gt;
                  &lt;/FormItem&gt;
                  &lt;FormItem name=&quot;password&quot; rules={[{ required: true, message: 'Please input your Password!' }]}&gt;
                  &lt;Input prefix={&lt;LockTwoTone  type=&quot;lock&quot; style={{ color: 'rgba(0,0,0,.25)' }} /&gt;} type=&quot;password&quot; placeholder=&quot;Password&quot; /&gt;
                  &lt;/FormItem&gt;
                  &lt;FormItem&gt;
                    &lt;Button type=&quot;primary&quot; htmlType=&quot;submit&quot; style={{marginRight: '10px'}}&gt;
                        Login
                    &lt;/Button&gt;
                  &lt;/FormItem&gt;
              &lt;/Form&gt;
          }
    &lt;/div&gt;
    );
   }
  } 
  const mapStateToProps = (state) =&gt; {
  return {
      loading: state.loading,
      error: state.error
  }
  }
   const mapDispatchToProps = dispatch =&gt; {
  return {
      onAuth: (username, password) =&gt; 
   dispatch(actions.authLogin(username, password)) 
      }
  }
    export default connect(mapStateToProps, mapDispatchToProps)(NormalLoginForm);
  </code></pre>
  <p>SignUp.js (username, email, password, confirm-password):</p>
  <pre><code>import React from 'react';
  import { MailTwoTone,LockTwoTone,UserOutlined,LoadingOutlined } from 
  '@ant-design/icons';
  import { Form, Input, Button } from 'antd';
  import { connect } from 'react-redux';
  import { NavLink } from 'react-router-dom';
  import * as actions from '../store/actions/auth';
  
  const FormItem = Form.Item;
  class RegistrationForm extends React.Component {
    state = {
      confirmDirty: false,
      };
    handleSubmit = (values) =&gt; {
      console.log(&quot;doesnt print me&quot;);
   }
    handleConfirmBlur = (e) =&gt; {
       const value = e.target.value;
       this.setState({ confirmDirty: this.state.confirmDirty || 
   !!value });
    }
    validateToNextPassword = (values, pass,item3) =&gt; {
       return true; // for simplicity
    }
    render() {    
     return (
  &lt;div&gt;
  
    &lt;Form onFinish={this.handleSubmit} className=&quot;sign-up-form&quot;&gt;
      
      &lt;FormItem name=&quot;username&quot; rules={[{ required: true, message: 'Please input your Username!' }]}&gt;            
              &lt;Input prefix={&lt;UserOutlined type=&quot;user&quot; style={{ color: 'rgba(0,0,0,.25)' }} /&gt;} placeholder=&quot;Username&quot; /&gt;            
      &lt;/FormItem&gt;
      
      &lt;FormItem name=&quot;email&quot; rules={[{
        type: 'email', message: 'The input is not valid E-mail!',
       }, {
        required: true, message: 'Please input your E-mail!',
       }]}&gt;          
          &lt;Input prefix={&lt;MailTwoTone type=&quot;mail&quot; style={{ color: 'rgba(0,0,0,.25)' }} /&gt;} placeholder=&quot;Email&quot; /&gt;          
      &lt;/FormItem&gt;
  
      &lt;FormItem name=&quot;password&quot; rules={[{
        required: true, message: 'Please input your Password!',
      },{
        validator: this.validateToNextPassword,
      }]}&gt;          
          &lt;Input prefix={&lt;LockTwoTone type=&quot;lock&quot; style={{ color: 'rgba(0,0,0,.25)' }} /&gt;} type=&quot;password&quot; placeholder=&quot;Password&quot; /&gt;          
      &lt;/FormItem&gt;
  
      &lt;FormItem name=&quot;confirm&quot; rules={[ {
        required: true, message: 'Please confirm your password!',
      },({ getFieldValue }) =&gt; ({
        validator(rule, value) {
          if (!value || getFieldValue('password') === value) {
            return Promise.resolve();
          }
          return Promise.reject('password does not match!');
        },
      }),
    ]}&gt;          
          &lt;Input prefix={&lt;LockTwoTone type=&quot;lock&quot; style={{ color: 'rgba(0,0,0,.25)' }} /&gt;} type=&quot;password&quot; placeholder=&quot;Confirm Password&quot; onBlur={this.handleConfirmBlur} /&gt;        
      &lt;/FormItem&gt;
  
      &lt;FormItem&gt;
        &lt;Button  type=&quot;primary&quot; htmlType=&quot;submit&quot; style={{marginRight: '10px'}}&gt;
            Sign Up
        &lt;/Button&gt;
      &lt;/FormItem&gt;
  
    &lt;/Form&gt;
  &lt;/div&gt;
  );
  }
  }
  
  const mapStateToProps = (state) =&gt; {
      return {
          loading: state.loading,
          error: state.error
      }
  }
  const mapDispatchToProps = dispatch =&gt; {
  return {
      onAuth: (username, email, password1, password2) =&gt; 
  dispatch(actions.authSignup(username, email, password1, password2)) 
  }
  }
  export default connect(mapStateToProps, mapDispatchToProps) 
  (RegistrationForm);
  </code></pre>
  <p>It is pretty much the same form that triggers the same function but it doesn't work on Signup.js
  I checked everything possible... what could be the reason?</p>