欢迎您访问 最编程 本站为您分享编程语言代码,编程技术文章!
您现在的位置是: 首页

多种使用axios.js和router进行页面跳转的方法

最编程 2024-08-08 11:04:59
...

对于某些特殊设置会要求我们在接口返回某些要求的时候对路由做跳转
比如:有个场景当后台状态返回22006的时候要求重新登陆,然而axios的js文件不能直接使用this.$router.push路由直接跳转,这是因为js文件无法使用vue申明的文件

以下有三种解决方式供大家参考

  1. 最原始的浏览器跳转方式(跳转刷新页面)
//axios.js文件
window.location.href = "/login"
  1. 先引入router文件
//axios.js文件
//注意是引入已经配置好的router文件
import router from './router'
//使用方式:
router.push({path:"/login"})
  1. main.js文件将vue挂载导出,代替this做跳转。
//main.js文件
//这里挂载之后便可全局使用
const myVue = new Vue({
 el: '#app',
  router,
  store,
  components: {
    App
  },
  template: '<App/>'
})
export default myVue

//axios.js文件
import myVue from "main.js"
//使用方式同this.$router.push一样,将this替换成myVue即可
myVue.$router.push({path:"/login"})

推荐阅读