如何在中间件上添加`redux-logger`?

时间:2017-12-14 03:42:35

标签: redux react-redux

我想在中间件链上添加redux-logger。以下是我的代码:

import {createStore, combineReducers, applyMiddleware, compose} from 'redux';
import reducers from './index';

import createLogger from 'redux-logger';
import thunk from 'redux-thunk';

const logger = createLogger ({
  log: 'info',
});
// create the global store
const store = compose (applyMiddleware (thunk, logger)) (createStore) (
  reducers
);

export default store;

我将通过以上代码获得以下错误:

applyMiddleware.js:39 Uncaught TypeError: middleware is not a function
    at applyMiddleware.js:39
    at Array.map (<anonymous>)
    at applyMiddleware.js:38

如果我将apply中间件更改为此行,它可以正常工作:

applyMiddleware (thunk, createLogger)

但我需要使用一些特定参数创建记录器。如何将创建的记录器添加到中间件链中?

3 个答案:

答案 0 :(得分:1)

如果您将商店更改为此应该可以正常工作:

const store = createStore(reducers, compose(applyMiddleware(thunk, logger)));

如果这不起作用,请查看此问题。它应该与我认为的上述代码相同。

https://github.com/gaearon/redux-thunk/issues/35

答案 1 :(得分:1)

import { applyMiddleware, compose, createStore } from 'redux';
import reducers from './index';
import thunk from 'redux-thunk';
import { logger } from 'redux-logger';

const composeEnhancers = typeof window === 'object' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({}) : compose;

const middlewareList = [thunk, logger]

const enhancer = composeEnhancers(
    applyMiddleware(...middlewareList)
);

const store = createStore(reducers, enhancer);

export default store;

答案 2 :(得分:0)

通过将import更改为import {createLogger} from 'redux-logger';来解决此问题。