首页 > 编程语言 >解决编程式路由跳转,多次执行抛出NavigationDuplicated异常

解决编程式路由跳转,多次执行抛出NavigationDuplicated异常

时间:2023-03-18 19:45:00浏览次数:46  
标签:resolve 跳转 NavigationDuplicated call location VueRouter reject apply 路由

 

 

解决:在vue-router的index.js中添加如下代码

//先保存router原型对象的push
let originPush = VueRouter.prototype.push
let originReplace = VueRouter.prototype.replace

//第一个参数:告诉push方法往哪里跳转,并传递哪些参数
//第二个参数: 成功回调
//第三个参数:失败回调
VueRouter.prototype.push = function(location, resolve, reject) {
    if (resolve && reject) {
        //js中的每个函数都有call和apply方法,唯一区别就是call传参用逗号隔开,apply使用数组,相同点都可以调用函数一次
        originPush.call(this, location, resolve, reject)
    } else {
        originPush.call(this, location, () => {}, () => {})
    }
}
VueRouter.prototype.replace = function(location, resolve, reject) {
    if (resolve && reject) {
        //js中的每个函数都有call和apply方法,唯一区别就是call传参用逗号隔开,apply使用数组,相同点都可以调用函数一次
        originReplace.call(this, location, resolve, reject)
    } else {
        originReplace.call(this, location, () => {}, () => {})
    }
}

 

标签:resolve,跳转,NavigationDuplicated,call,location,VueRouter,reject,apply,路由
From: https://www.cnblogs.com/ixtao/p/17231567.html

相关文章

  • webpack性能优化(1):分隔/分包/异步加载+组件与路由懒加载
    webpackensure相信大家都听过。有人称它为异步加载,也有人说做代码切割,那这个家伙到底是用来干嘛的?其实说白了,它就是把js模块给独立导出一个.js文件的,然后使用这个模块的时......
  • 动态路由协议
    1动态路由的概述​虽然静态路由在有些时候很有用,但是是必须是手动操作每条路由条目,对于大型网络来说经常改变的情况,配置静态路由工作量非常繁重,因此使用动态路由是必要的。......
  • Ocelot使用与设置路由Routing
    一、安装Ocelot在程序包管理器控制台输入以下命令安装OcelotInstall-PackageOcelot二、新建两个项目我们新建两个.NetCoreWebAPI项目如下: 直接就是最初始化的......
  • Ocelot使用与设置路由Routing
    一、安装Ocelot在程序包管理器控制台输入以下命令安装OcelotInstall-PackageOcelot二、新建两个项目我们新建两个.NetCoreWebAPI项目如下: 直接就是最初始化的......
  • 路由元信息的使用
    配置路由的时候,可以给路由添加路由元信息meta举例:让组件Footer在Home和Search中展示,登录注册时隐藏路由配置//配置路由exportdefaultnewVueRouter({routes:[......
  • Ajax提交后Moedl And View不进行页面跳转的解决方案
    场景前端使用ajax请求后台,返回ModelAndView后不进行页面跳转。用ajax提交是没有页面跳转的。实现如果只是简单的页面跳转和传递单个简单参数可以使用:window.location.hre......
  • vue实现文字超出3行时,后面显示省略号 查看更多跳转详情
       <divclass="dp-text-ellipsis-wrapper">    <divclass="text":style="textStyleObject"ref="text">       <labelclass="btn"@cli......
  • 软路由折腾记录一:彻视r69s
    购置需求:pve,  openwrt直通网卡,32g内存跑内部服务和一些虚拟机大概配置:n4500双核单线程       4口2.5g网口(此网口安装win不联网情况下,win10\win8,驱动精灵......
  • BGP路由无效的原因
     路由震荡:  ......
  • flask-快捷路由装饰器
    快捷路由装饰器等价于app.get('/login')app.route('/login',methods=['GET'])app.post('/login')app.route('/login'),methods=['POST'app.put('/login')......