Nuxt在axios等独立插件中使用路由
作者:WaynePeng 来源:juejin.im 更新时间:2023-05-25 21:55
未测试:
最近在开发一个网站,用的nuxt搭建的框架,因为需要在请求token过期之后提示用户重新登录并且返回登录页面,但是在axios的配置文件中使用router.push一直报错,都准备放弃使用公众组件去进行路由跳转了,但是天无绝人之路,最终在官方文档中找到了redirect,具体操作如下:
- 在axios的js文件中添加默认的方法,并且获取redirect,并且使用使用myredirect将redirect储存起来
let myredirect;
export default function ({redirect }) {
myredirect = redirect;
}
复制代码
- 在需要使用路由跳转的地方进行跳转(此处在判断token过期时跳转)
if (error.message.toString().slice(-3) === '401') {
Vue.prototype.$message.error('登陆超时,请重新登陆...')
setTimeout(function () {
return myredirect('/login/login')
}, 2000)
}
复制代码
ok,到这里我们的路由跳转就配置好了,当我们的token过期之后我们就会重定向跳转到登录页面了