• 5
  • 新人请关照

redux中使用combineReducers报错

如图,我使用combineReducers将两个reducers合并并暴露出去,

// '/reducers/index.js'
import { combineReducers} from 'redux'
import counter from './counter'
import login from './login'
 
export default combineReducers({ 
    counter, 
    login
})
// export default counter;
// '/reducers/login.js'
function login( state = { isLogin: false, user: 'sky'}, action) {
    switch (action.type) {
        case 'LOGIN' :
            return {...state, isLogin: true}
        case 'LOGOUT' :
            return {...state, isLogin: false}
        default :
        return state
    }
}
export default login;
// '/reducers/counter.js'
function counter(state = 0, action) {
    switch (action.type) {
        case 'INCREMENT' :
            return state + 1
        case 'DECREMENT' :
            return state - 1
        default :
        return state
    }
}
export default counter;

这里是项目的入口文件

// 'index.js'
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import Login from './components/login'
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import { Provider } from 'react-redux';
import rootReducer from './reducers/index';
import { BrowserRouter, Route} from 'react-router-dom'

let store = createStore(rootReducer, applyMiddleware(thunk));
console.log(store.getState())

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

然后就出现了图中的报错:
clipboard.png

如图,console是打印出了state,并且也符合定义,
clipboard.png

编译没有报错:
clipboard.png

有没有大佬遇到这样的问题啊?我的redux和react-redux版本是:
clipboard.png

阅读 514
评论
    2 个回答
    • 3.4k

    我猜,你应该是在渲染APP组件时,直接渲染了从redux的store中取到的state这个对象了。因为你用react直接渲染一个对象,是会报这个错误的

      相似问题
      推荐文章