Ya tengo una pieza de middleware conectada, redux-thunk , y me gustaría agregar otra, redux-logger .
¿Cómo lo configuro para que mi aplicación use ambas piezas de middleware? Intenté pasar una matriz de [ReduxThunk, logger] pero no funcionó.
Código:
import React from 'react'; import ReactDOM from 'react-dom'; import { Provider } from 'react-redux'; import { createStore, applyMiddleware } from 'redux'; import ReduxThunk from 'redux-thunk'; import logger from 'redux-logger'; import App from './components/app'; import reducers from './reducers'; require('./style.scss'); const createStoreWithMiddleware = applyMiddleware(ReduxThunk)(createStore); ReactDOM.render( <Provider store={createStoreWithMiddleware(reducers)}> <App /> </Provider>, document.querySelector('#app') );applyMiddleware toma cada pieza de middleware como un nuevo argumento (no como una matriz). Así que solo pase cada pieza de middleware que desee.
const createStoreWithMiddleware = applyMiddleware(ReduxThunk, logger)(createStore);la respuesta de andy es buena, pero considere que su middleware está creciendo, los códigos a continuación serán mejores:
const middlewares = [ReduxThunk, logger] applyMiddleware(...middlewares)applyMiddleware debe pasar a createStore como segundo parámetro. applyMiddleware puede tener varios middlewares como argumentos.
const store = createStore(reducers, applyMiddleware(ReduxThunk, logger)); ReactDOM.render( <Provider store={store}> <App /> </Provider>, document.querySelector('#app') );