1

我正在尝试实施 redux-persist 以仅保留特定的减速器、发票、版本，但就我而言，我的减速器都消失了。

这是入口点：

import React, { Component } from "react";
import { Provider } from "react-redux";
import { createStore, applyMiddleware, compose } from "redux";
import { persistStore, persistCombineReducers } from "redux-persist";
import { createWhitelistFilter } from "redux-persist-transform-filter";
import { PersistGate } from 'redux-persist/es/integration/react';
import storage from "redux-persist/lib/storage";
import thunkMiddleware from "redux-thunk";
import { apiMiddleware } from "redux-api-middleware";
import reducers from "./actions/reducers";
import AppContainer from "./containers/App";
import FlashMessage from "./containers/common/FlashMessage";
import "./App.css"

const middleware = [thunkMiddleware, apiMiddleware];

const persistConfig = {
  storage,
  key: 'root',
  transforms: [
    createWhitelistFilter('invoices')
  ]
};
const store = createStore(
  persistCombineReducers(persistConfig, reducers),
  compose(
    applyMiddleware(...middleware),
  )
);

const persistor = persistStore(store);

export default class App extends Component {
  render () {
    return (
      <Provider store={store}>
        <PersistGate persistor={persistor}>
          {/*<FlashMessage/>*/} // Since there is no reducer, this fails
          <AppContainer/>
        </PersistGate>
      </Provider>
    )
  }
}

这是我拥有的减速器文件：

import { combineReducers } from "redux";
import { routerReducer as router } from "react-router-redux";
import app from "./app";
import invoices from "./invoices/invoices";
import recipients from "./recipients/recipients";

export const makeRootReducer = (asyncReducers) => {
  return combineReducers({
    router,
    app,
    invoices,
    recipients,
    ...asyncReducers
  })
};

export const injectReducer = (store, { key, reducer }) => {
  store.asyncReducers[key] = reducer;
  store.replaceReducer(makeRootReducer(store.asyncReducers))
};

export default makeRootReducer;

我遵循了很多建议，但我一定遗漏了一些东西。

4

1 回答 1

2

我发现了原因。检查源代码后，我看到了以下文档块persistCombineReducers：

/**
     * It provides a way of combining the reducers, replacing redux's @see combineReducers
     * @param config persistence configuration
     * @param reducers set of keyed functions mapping to the application state
     * @returns reducer
     */
    export function persistCombineReducers<S>(config: PersistConfig, reducers: ReducersMapObject): Reducer<S & PersistedState>;

关键词是“替换 redux 的 @see combineReducers”。

combineReducers从我的 reducers 文件中删除到以下文件解决了这个问题：

import { routerReducer as router } from "react-router-redux";
import app from "./app";
import invoices from "./invoices/invoices";
import recipients from "./recipients/recipients";

const reducers = {
  router,
  app,
  invoices,
  recipients,
};

export default reducers;
于 2018-04-24T05:59:12.587 回答