redux 报错TypeError: Cannot read property 'state' of undefined

Question

redux 报错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}){//发送注册请求
    if(!username||!pwd){
        return Error_Msg('用户名或密码错误')
    }
    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">显示错误信息</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">确认</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="立即注册" 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')
);

Answer 1

请问下，解决了么？我目前也是出了这个问题

Answer 2

我也是遇到这个问题，请问下怎么解决呢

Answer 3

redux-devtool扩展插件的问题,我更新了就不报错了