redux 報(bào)錯(cuò)TypeError: Cannot read property 'state' of undefined

redux 報(bào)錯(cuò)TypeError: Cannot read property 'state' of undefined

reducer

import axios from 'axios'

const REGISTER_SUCCESS='REGISTER_SUCCESS'
const LOGIN_SUCCESS='LOGIN_SUCCESS'
const ERROR_MSG='ERROR_MSG'
const initial={
    username:'',
    pwd:'',
    msg:''
}
export default function user(state=initial,action){
    switch(action.type){
        case REGISTER_SUCCESS:
            return {...state,...action.payload}
        case ERROR_MSG:
            return {...state,msg:action.msg}
        default:
            return state
    }
}

function Success(payload){
    return{type:'REGISTER_SUCCESS',payload:payload}
}
function Error_Msg(msg){
    return{type:'ERROR_MSG',msg:msg}
}
export function regisger({username,pwd,repwd}){//發(fā)送注冊(cè)請(qǐng)求
    if(!username||!pwd){
        return Error_Msg('用戶名或密碼錯(cuò)誤')
    }
    if(pwd!==repwd){
        return Error_Msg('兩次密碼不一致')
    }
    return dispatch=>{
        axios.post('/register',{username,pwd})
        .then(res=>{
            if(res.status==200&&res.data.code==1){
                dispatch(Success({username,pwd}))
            }else{
                dispatch(Error_Msg(res.data.msg))
            }
        })
    }
}

組件：

import React from 'react'
import ReactDOM from 'react-dom'
import {connect} from 'react-redux'
import  './register.css'
import {regisger} from '../../redux/user_redux'
class Register extends React.Component{
    constructor(){
        super();
        this.state={
            username:'',
            pwd:'',
            repwd:''
        }
    }
    handleClick(){
        this.props.regisger(this.state)
        console.log(this.props);
    }
    handleChange(key,val){
        this.setState({
            [key]:val
        })
    }
    render(){
        return (
                <form className="register">
                    <div id="form">
                        <div className="input-area">
                            <div className="input-label">
                                <label htmlFor="username">昵稱</label>
                            </div>
                            <div className="input-outer">
                                <input type="text" id="username" name="username" onChange={v=>this.handleChange('username',v.target.value)}/>
                            </div>

                            <p className="input-error">顯示錯(cuò)誤信息</p>
                        </div>

                        <div className="input-area">
                            <div className="input-label">
                                <label htmlFor="password">密碼</label>
                            </div>
                            <div className="input-outer">
                                <input type="password" id="password" name="password" onChange={v=>this.handleChange('pwd',v.target.value)}/>
                            </div>

                            <p className="input-error">1111</p>
                        </div>
                
                        <div className="input-area">
                            <div className="input-label">
                                <label htmlFor="repassword">確認(rèn)</label>
                            </div>
                            <div className="input-outer">
                                <input type="password" id="repassword" name="repassword" onChange={v=>this.handleChange('repwd',v.target.value)}/>
                            </div>

                            <p className="input-error">1111</p>
                        </div>

                        <div className="input-area">
                            <input type="button" value="立即注冊(cè)" onClick={this.handleClick.bind(this)}/>
                        </div>
                    </div>
                </form>
            
        )
    }
}
export default connect(
    state=>state,
    {regisger}
)(Register)

index.js

import React from 'react'
import ReactDOM from 'react-dom'
import { createStore, applyMiddleware, compose } from 'redux'
import thunk from 'redux-thunk'
import {Provider} from 'react-redux'
import {BrowserRouter,Route,Switch} from 'react-router-dom'

import Register from './component/register/register'
import Login from './component/login/login'
import Home from './component/home/home'
import './index.css'
import reducers from './redux/user_redux.js'
const store = createStore(reducers, compose(
    applyMiddleware(thunk),
    window.devToolsExtension?window.devToolsExtension():f=>f
))

ReactDOM.render(
    (<Provider store={store}>
        <BrowserRouter>
            <Switch>
                <Route path='/' exact component={Home}></Route>
                <Route path='/register' component={Register}></Route>
                <Route path='/login' component={Login}></Route>
            </Switch>
        </BrowserRouter>
    </Provider>),
    document.getElementById('root')
);