redux-persist合并reducer時(shí)報(bào)錯(cuò)

問(wèn)題描述

報(bào)錯(cuò)信息：

Store does not have a valid reducer. Make sure the argument passed to combineReducers is an object whose values are reducers.

問(wèn)題出現(xiàn)的環(huán)境背景及自己嘗試過(guò)哪些方法

我將不同功能的reducer放到不同的文件夾下，然后使用redux-persist進(jìn)行數(shù)據(jù)持久化處理，web項(xiàng)目會(huì)經(jīng)常刷新么，所以想讓store中的數(shù)據(jù)不丟失，然而合并reducer應(yīng)用combineReducers方法是報(bào)錯(cuò)，不知道為什么

相關(guān)代碼

// 請(qǐng)把代碼文本粘貼到下方（請(qǐng)勿用圖片代替代碼）
reducer

import * as Pages from './action-types';

let defaultValue = {
    user_name: "",
    user_id: ""
}

export default function UserInfo (state = defaultValue, action = {}) {
    switch (action.type) {
        case Pages.SAVEUSERINFO:
            return { ...state,
                ...{
                    user_name: action.data.data.username,
                    user_id: action.data.data.id
                }
            };
        default:
            return state;
    }
}

合并位置

import {
    combineReducers,
} from 'redux';
import UserInfo from './Pages/reducers';
import SaveInfo from './Layout/reducers';


const rootReducer = combineReducers({ 
    UserInfo,
    SaveInfo
});

export default rootReducer;

入口文件

import {
    Provider
} from 'react-redux';
import {
    createStore,
    applyMiddleware
} from 'redux';
// 這個(gè)Reducers就是我合并的reducer
import Reducers from '@/Reducers';
import thunk from 'redux-thunk';
import {persistStore, persistCombineReducers} from 'redux-persist';
import { PersistGate } from 'redux-persist/es/integration/react';

import storage from 'redux-persist/es/storage'
const config = {
    key: 'root',
    storage,
};

function configureStore(){
    console.log(Reducers)
    let reducer = persistCombineReducers(config, Reducers);
    let store = createStore(reducer, applyMiddleware(thunk));
    let persistor = persistStore(store);
    return { persistor, store }
}
const render = Component => {
    const { persistor, store } = configureStore();
    ReactDOM.render(
        //綁定redux、熱加載
        <Provider store={store}>
            <PersistGate persistor={persistor}>
                <Component />
            </PersistGate>
        </Provider>,
        document.getElementById('app'),
    )
}

你期待的結(jié)果是什么？實(shí)際看到的錯(cuò)誤信息又是什么？

期待無(wú)論怎么刷新瀏覽器，刷新之前的store中的數(shù)據(jù)能保存到刷新之后來(lái)

回答

編輯回答

下墜

persistCombineReducers這個(gè)方法不知道是我用的不對(duì)還是被官方廢棄了，看文檔使用persistReducer方法來(lái)合并config和reducer即可完成實(shí)現(xiàn)

import { persistStore, persistReducer } from 'redux-persist';
const persistedReducer = persistReducer(persistConfig, Reducers)
function configureStore(){
    let store = createStore(persistedReducer, applyMiddleware(thunk));
    let persistor = persistStore(store);
    return { persistor, store }
}
const render = Component => {
    const { persistor, store } = configureStore();
    ReactDOM.render(
        //綁定redux、熱加載
        <Provider store={store}>
            <PersistGate persistor={persistor}>
                <Component />
            </PersistGate>
        </Provider>,
        document.getElementById('app'),
    )
}

哪位大神如果有具體的問(wèn)題原因也煩請(qǐng)告知一下，感激不盡

2018年2月19日 02:59