Reactjs 多次重复表单呈现失败

嗨，我正在尝试实现多个redux表单。但是我在输出中得到了相同的redux形式。有人能调查一下，告诉我哪里出了问题：

表格1:Signup.js

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

const validate = values =>{
    const errors={};
    if(!values.username){
        errors.username="Please Enter Username";
    }else if(values.username.length<5){
        errors.username='Please enter atlease 5 characters';
    }
    if (!values.email) {
        errors.email = 'Required'
      } else if (!/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values.email)) {
        errors.email = 'Invalid email address'
    }
    if(!values.password){
        errors.password='Please enter password'
    }
    return errors;
}

const renderField = ({ input, label, type, meta: { touched, error } }) => (
    <div>
      <label>{label}</label>
      <div>
        <input {...input} placeholder={label} type={type}/>
        {touched && ((error && <span>{error}</span>))}
      </div>
    </div>
  )

  const SyncValidationForm = (props) => {
    const { handleSubmit, pristine, reset, submitting } = props
    return (
      <form onSubmit={handleSubmit}>
        <Field name="username" type="text" component={renderField} label="Username"/>
        <Field name="email" type="email" component={renderField} label="Email"/>
        <Field name="password" type="password" component={renderField} label="Password"/>
        <div>
          <button type="submit" disabled={submitting}>Submit</button>
          <button type="button" disabled={pristine || submitting} onClick={reset}>Clear Values</button>
        </div>
      </form>
    )
  }

  export default reduxForm ({
    form: 'syncValidation',  
    validate     
  })(SyncValidationForm)

现在它给出了如下输出：

---

有人能帮我找出哪里出了问题吗

对不起，我导入了错误的表单。

对不起，我导入了错误的表单

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

const renderField = ({input, label, type})=>{
    <div>
      <label>{label}</label>
      <div>
        <input {...input} placeholder={label} type={type}/>
      </div>
    </div>
}
const Login = (props) =>{
    const {handleSubmit} = this.props;
    return(
        <form onSubmit={handleSubmit}>
            <div>
                <Field name='username' component={renderField} type='text' label='Username'/>
                <Field name='password' type='password' component={renderField} label='Password'/>
            </div>
            <div>
                <button type='submit' disabled={submit}>Submit</button>
            </div>
        </form>
    )
}

export default reduxForm ({
    form:'login'
})(Login);

import React from 'react';
import {connect} from 'react-redux';
import SyncValidationForm from "../Form/signup";
import Login from "../Form/signup";

class Homepage extends React.Component{
    render(){
        return(
            <div>
                <SyncValidationForm onSubmit={this.props.addition}/>
                <Login />
            </div>
        )
    }
}

var matchStatetoProps = state =>{
    return {root:state.root}
}

var matchDispatchtoProps = dispatch =>{
    return{addition:(values)=>dispatch({type:'ADD',payload:values})}
}

export default connect(matchStatetoProps,matchDispatchtoProps)(Homepage);

import { createStore, combineReducers } from 'redux';
import { reducer as reduxFormReducer1 } from 'redux-form';
import { reducer as reduxFormReducer2 } from 'redux-form';
import rootReducer from '../Reducers/rootReducer'

const reducer = combineReducers({
  form: reduxFormReducer1, 
  login:reduxFormReducer2,  
  root: rootReducer
});
const store = (window.devToolsExtension
  ? window.devToolsExtension()(createStore)
  : createStore)(reducer);

export default store;