我无法弄清楚在 redux 商店中同时使用 devToolsExtension 和中间件的确切方法。
下面是我的 redux 商店代码。
import {createStore, combineReducers, applyMiddleware} from 'redux';
import thunk from 'redux-thunk';
import counterReducer from './../reducers/counterReducer';
const reducers = combineReducers({
counter: counterReducer
});
const store = createStore(
reducers,
{counter: {count:0} },
// window.devToolsExtension && window.devToolsExtension(),
applyMiddleware(thunk)
);
export default store;
由于 createStore() 需要 3 个参数。
在应用中间件 thunk 之前,我将它用作下面的代码,这对我来说很好。
const store = createStore(
reducers,
{counter: {count:0} },
window.devToolsExtension && window.devToolsExtension()
);
现在,我需要同时使用 devToolsExtension 以及应用中间件。
我试图将 devToolsExtension 和 applyMiddleware 放在数组中,以便它充当第三个参数,但这不起作用。
const store = createStore(
reducers,
{counter: {count:0} },
[window.devToolsExtension && window.devToolsExtension(),
applyMiddleware(thunk)]
);
现在的情况是我需要使用 devToolsExtension 作为第三个参数或 applyMiddleware() 作为第三个参数。
但我想同时使用两者。
我怎样才能做到这一点?
最佳答案
你可以这样做
import { createStore, applyMiddleware,compose } from 'redux';
import reducers from '../reducers';
import reduxThunk from 'redux-thunk';
import {signOut} from '../actions/signOut';
import {checkLoggedInState} from '../actions/signIn';
//For Dev Tools -todo =remove for production bundle
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
// const createStoreWithMiddleware=applyMiddleware()(createStore);
const store=createStore(reducers,composeEnhancers(
applyMiddleware(reduxThunk,signOut,checkLoggedInState)
));
export default store;
关于javascript - 在 React-Redux Store 中配置 devToolsExtension 和 applyMiddleware(),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50737286/