我正在尝试制作一个简单的gitHub配置文件审查react应用程序,我正在学习中间件,但我似乎有一点问题,当我把中间件传递给configureStore时,它似乎没有正确接收它
这是我的index.js中的代码:
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import { configureStore, applyMiddleware } from '@reduxjs/toolkit';
import theReducer from './Store/reducer';
import { Provider } from 'react-redux';
const logger = store => next => action =>{
console.log('[middleWare] Dispatching' , action);
const result = next(action);
console.log('[middleWare] next state' , store.getState());
return result;
}
const middleWare = applyMiddleware(logger);
const store = configureStore({ reducer: theReducer}, middleWare);
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<React.StrictMode>
<Provider store={store}>
<App />
</Provider>
</React.StrictMode>
);
reportWebVitals();
当我向Reducer发送一个操作时,我希望我的操作和存储会出现在控制台中,然后我怀疑我可能没有正确地调度我的操作,我将这个中间件应用到另一个react应用程序中,在那里我学习了redux(每个人都教react-redux的计数器应用程序)在那里我知道调度动作是有效的,结果是一样的。唯一不同的是,他们将中间件传递给createStore函数,如下所示:const store = createStore(reducer, middleware);
但是我不能再用这个了,因为新的configureStore函数现在很流行。我怎么能用configureStore函数把我的中间件传递到商店呢?这可能吗?
1条答案
按热度按时间uurv41yg1#
好吧,我真的应该更深入地研究redux文档:),下面是我一直在寻找的答案:
https://redux-toolkit.js.org/api/getDefaultMiddleware
getDefaultMiddleware在您想要添加一些定制中间件,但仍然想要添加默认中间件时非常有用: