5

我正在尝试将 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;
4

5 回答 5

4

从文档：

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

    const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

    const store = createStore(reducer, composeEnhancers(applyMiddleware(...middleware));
  ));
于 2020-01-11T19:04:42.883 回答
4

最简单的方法是安装

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
));

阅读有关配置的更多信息

于 2019-03-06T16:01:08.177 回答
3

这对我有用。我只是使用 compose 方法将 Thunk 和 Dev Tools 结合起来。

import { createStore, applyMiddleware , compose} from 'redux'
import thunk from 'redux-thunk'
import rootReducer from './reducers'

const store = createStore(rootReducer, compose(applyMiddleware(thunk), window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()));

export default store
于 2020-12-03T02:13:48.807 回答
0

不工作的原因：当我们一起使用redux-devtools-extension和redux-thunker时，由于配置不正确，它不能工作。我遇到了同样的问题。

解决方案 ：

需要 npm 包 ：

npm i  redux 
npm i  redux-devtools-extension
npm i  redux-thunker

代码：

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

import createThunkerMiddleware from 'redux-thunker';

import rootReducer from './reducers/index';

const initialState = {};

const thunk = createThunkerMiddleware({
  extraArgumentsEnhanced: {
    fetch,
  },
});
const middleware = [thunk];

export default createStore(
  rootReducer,
  initialState,
  composeWithDevTools(applyMiddleware(...middleware))
);
于 2020-06-17T02:04:54.690 回答
0

我已经在一个类似的问题中回答了这个问题，这里是链接。

简而言之，您需要composeEnhancer通过从“redux”导入 compose 来创建一个，并将您的 ReduxDevTools 扩展放在那里，并在您的商店中使用 2 个参数。

const composeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

const Store = createStore(rootReducer, composeEnhancer(applyMiddleware(thunk)))

ReactDOM.render(<Provider store={Store}><BrowserRouter><App/></BrowserRouter></Provider>, document.getElementById('root'));
于 2020-08-13T08:35:20.093 回答