DEV Community

Dennis Zhang
Dennis Zhang

Posted on

redux中间件middleware

中间件的作用用于处理dipatch前后控制,类似于nodejs的eggjs的洋葱模式中间件

在 Redux 中使用这个中间件,你可以通过 applyMiddleware

将它应用到 Redux store:

import { createStore, applyMiddleware } from 'redux';
import rootReducer from './reducers';

// 创建中间件实例
const loggerMiddleware = logger;

// 创建 Redux store 并应用中间件
const store = createStore(
  rootReducer,
  applyMiddleware(loggerMiddleware,log2)
);
Enter fullscreen mode Exit fullscreen mode

logger中间件

function logger(store) {
  return function(next) {
    return function(action) {
      // 打印正在 dispatch 的 action
      console.log('dispatching', action);

      // 调用下一个中间件或最终的 dispatch 函数
      const result = next(action);

      // 打印更新后的 state
      console.log('next state', store.getState());

      // 返回 result 以便继续处理
      return result;
    };
  };
}

Enter fullscreen mode Exit fullscreen mode

Top comments (0)