连接 Redux devtools 和 Thunk 中间件进行存储

Question

我正在尝试将 redux-devtools 连接到我的商店，但不断收到以下错误：“看起来您正在将多个商店增强器传递给 createStore()。这是不支持的。相反，请将它们组合在一起形成一个函数错误。 ”

*使用Thunk作为中间件。

尝试使用增强器，但我仍然遇到不同的错误。

帮助将不胜感激。

这就是我的商店的样子：

import {createStore,applyMiddleware} from 'redux';
import thunk from 'redux-thunk'

const initialState={
 bla:"",
 bla:"",
 bla:"",
}

const reducer = (state= initialState, action)=>{
 bla bla bla..
 actions...
}


const store= createStore(reducer,applyMiddleware(thunk))

export default store;

Answer 1

来自文档：

    import { createStore, applyMiddleware, compose } from 'redux';

    const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

    const store = createStore(reducer, composeEnhancers(applyMiddleware(...middleware));
  ));

Answer 2

最简单的方法是安装

npm install --save-dev redux-devtools-extension

然后 ：

import { createStore, applyMiddleware } from 'redux';
import thunk from "redux-thunk";
import { composeWithDevTools } from 'redux-devtools-extension';

   const middlewares = [thunk, ...others ];

    const appReducers = combineReducers({
      yourReducers
    });


const store = createStore(appReducers, composeWithDevTools(
  applyMiddleware(...middleware),
  // other store enhancers if any
));

阅读有关配置的更多信息