react在普通函数中跳转页面?

作者站长头像
站长
· 阅读数 5

封装了一个axios，想要在token过期的时候做返回登录页的统一处理，代码如下：if (response.data.errno === 1) {

//登录过期回到登录页
let navigate = useNavigate()
navigate('/login')

}报错了，如下：react在普通函数中跳转页面?

使用window.location.href可以成功，除次之外，react还有别的跳转方法吗这是当前的文件内容

//http.ts
import axios, { AxiosInstance } from "axios"
import { AxiosRequest } from "./types"
import { message, Spin } from 'antd';
import Loading from "./loading";
import { useNavigate } from "react-router-dom"
const navigate = useNavigate();
class HTTP {

    interceptRequest(response){
        if (response.data.errno === 1) {
            //登录过期回到登录页
            navigate('/login')
        }
    }
回复
1个回答
avatar
test
2024-06-23

下面链接是react-router-dom@6的组件外跳转方式：https://segmentfault.com/a/1190000044558173#item-6

react-router-dom@5的方式

// history.js
import { createBrowserHistory } from 'history'

export default createBrowserHistory()
// App.js
import { Router, Route, Switch } from 'react-router-dom'
import history from './history'

function App() {
  render() {
      return <Router history={history}>...</Router>
  }
}
// other.js
import history from './history'

history.push('/index')
回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引，对解决问题有帮助
  • 遵循 Markdown 语法排版，代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容