React & RTK:如何从中间件进行调度？

Question

我使用RTK (Redux )和RTK查询来管理我的存储和API请求。

为了在全球范围内捕获错误，我跟踪这个例子。这很好，但是现在我想在请求因401 - Unauthorized-error而被拒绝时注销用户。

const rtkQueryErrorLogger = api => next => action => {
  if (isRejectedWithValue(action)) {
    if (action.payload.status === 401) {
      // Reset the store (not working)
      const dispatch = useDispatch();
      const dipatch(logout());
  
      // Forward to login-screen (not working)
      const navigation = useNavigation();
      navigation.push('Login');
    }
  }
  return next(action);
};

有什么想法吗？提前感谢！

Answer 1

Redux中间件总是将一个“mini”对象作为最外层函数的参数，该函数包含{dispatch, getState}。

https://redux.js.org/tutorials/fundamentals/part-4-store#writing-custom-middleware

在本例中，它是示例中名为api的变量。

您可以从该对象访问dispatch，并在中间件中的任何时候分派一个操作。只需删除const dispatch = useDispatch行，或者将下一行更改为api.dispatch()，或者从声明中的api对象中重构dispatch。