相关疑难解决方法(0)

import axios from "axios";
import { useNavigate } from "react-router-dom";

export const api = axios.create({
  baseURL: "http://127.0.0.1:8000/",
  headers: {
    "content-type": "application/json",
  },
});

api.interceptors.response.use(
  function (response) {
    return response;
  },
  function (er) {
    if (axios.isAxiosError(er)) {
      if (er.response) {
        if (er.response.status == 401) {

          // Won't work
          useNavigate()("/login");

        }
      }
    }

    return Promise.reject(er);
  }
);

现在我有一个历史记录模块，它让我甚至可以在反应组件之外使用历史记录：

import { createBrowserHistory } from 'history';

export default createBrowserHistory();

然后我直接在App.jsx中使用这个历史记录

import { Router } from 'react-router-dom';
...
<Router history={history}>...</Router>

我可以在任何地方导入和使用相同的历史对象。即使在任何反应组件之外的自定义助手中也是如此。

这如何在React router 6中工作？

由于历史记录被导航取代，我在网上还没有看到任何解决方案。

我知道它仍处于测试阶段，但我想提前检查一下。

感谢您的任何想法！