BrowserRouter.push 不是使用 React-Router-Dom 的函数错误 [重复]

【问题标题】：BrowserRouter.push is not a function error using React-Router-Dom [duplicate]BrowserRouter.push 不是使用 React-Router-Dom 的函数错误 [重复]
【发布时间】：2021-05-17 14:22:50
【问题描述】：

使用 React-Router-Dom 路由时出现 401 错误时显示以下错误：-

代码片段

axios.interceptors.response.use((response) => {
      return response
}, function (error) {
   if (error.response.status === 401) {
        Router.push('/login');
        return Promise.reject(error);
   }

错误日志：- react_router_dom__WEBPACK_IMPORTED_MODULE_4__.BrowserRouter.push 不是函数

任何帮助/建议将不胜感激。

谢谢

【问题讨论】：

标签： reactjs react-router-dom

【解决方案1】：

您可以创建自定义历史记录并使用它。这将使您也可以从组件外部使用导航

import { Router } from "react-router-dom";
import { createBrowserHistory } from "history";

export const history = createBrowserHistory();

...
  <Router history={history}>
    <App />
  </Router>
...

也可以在其他地方使用它

import { history } from './path/to/history';

...

    axios.interceptors.response.use((response) => {
          return response
    }, function (error) {
       if (error.response.status === 401) {
            history.push('/login');
            return Promise.reject(error);
       }
...

【讨论】：