vue-router ≥3.0版本回调形式以及改成promise api的形式了,返回的是一个promise,如果路由地址跳转相同, 且没有捕获到错误,控制台始终会出现如图所示的警告 (注:3.0以下版本则不会出现以下警告!!!,因路由回调问题…)

方案一:
安装vue-router3.0以下版本:先卸载3.0以上版本然后再安装旧版本 npm install @vue-router2.8.0 -S

方案二:
针对于路由跳转相同的地址添加catch捕获一下异常:this.$router.push('/location').catch(err => { console.log(err) })

方案三:
在main.js下注册一个全局函数即可

import Router from 'vue-router'

const originalPush = Router.prototype.push
Router.prototype.push = function push(location) {
return originalPush.call(this, location).catch(err => err)
}

注:官方vue-router新版本路由默认回调返回的都是promise,原先就版本的路由回调将废弃!!!!
————————————————
原文链接:https://blog.csdn.net/weixin_45522694/article/details/99548714

vue -- router路由跳转错误 , NavigationDuplicated的更多相关文章

  1. vue router路由跳转了,但是页面没有变(已解决)

    小白学习 router.js:两个组件之间跳转 但是路由变了,页面没有改变的原因是因为app.vue里面没有router-view(很关键)

  2. Vue.之.路由跳转

    Vue.之.路由跳转 在进行项目开发的过程中,需要使用路由进行跳转.如下: // 不带有参数,在页面上跳转到别的页面 1. this.$router.push('/login/init');  // ...

  3. 前端MVC Vue2学习总结(八)——Vue Router路由、Vuex状态管理、Element-UI

    一.Vue Router路由 二.Vuex状态管理 三.Element-UI Element-UI是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架,手机端有对应框架是 Mint U ...

  4. Vue Router路由守卫妙用:异步获取数据成功后再进行路由跳转并传递数据,失败则不进行跳转

    问题引入 试想这样一个业务场景: 在用户输入数据,点击提交按钮后,这时发起了ajax请求,如果请求成功, 则跳转到详情页面并展示详情数据,失败则不跳转到详情页面,只是在当前页面给出错误消息. 难点所在 ...

  5. Vue系列:Vue Router 路由梳理

    Vue Router 是 Vue.js 官方的路由管理器.它和 Vue.js 的核心深度集成,让构建单页面应用变得易如反掌.包含的功能有: 嵌套的路由/视图表 模块化的.基于组件的路由配置 路由参数. ...

  6. Vue之路由跳转 传参 aixos 和cookie

    一.路由跳转 1.1 项目的初始化 vue create m-proj   >>>创建vue项目 精简vue项目的 views 视图   About(基本是删除的) Home.(可以 ...

  7. vue设置路由跳转参数,以及接收参数

    最近做Vue项目,遇到了一个路由跳转问题:首页要跳转到项目页指定的Tab选项卡项,一开始总是跳到默认项.解决方法如下: 在跳转链接处设置了路由跳转参数,如下: <router-link  :to ...

  8. vue二级路由跳转后外部引入js失效问题解决方案

    vue路由可以通过children嵌套,于是可以形成二级路由等等... 案例如下: routes: [ { path: '/', name: 'dy', component: dy, children ...

  9. 04 Vue Router路由管理器

    路由的基本概念与原理 Vue Router Vue Router (官网: https://router.vuejs.org/zh/)是Vue.js 官方的路由管理器. 它和vue.js的核心深度集成 ...

随机推荐

  1. Subsequence(HDU3530+单调队列)

    题目链接 传送门 题面 题意 找到最长的一个区间,使得这个区间内的最大值减最小值在\([m,k]\)中. 思路 我们用两个单调队列分别维护最大值和最小值,我们记作\(q1\)和\(q2\). 如果\( ...

  2. 08 c++中运算符重载(未完成)

    参考:轻松搞定c++语言 定义:赋予已有运算符多重含义,实现一名多用(比较函数重载) 运算符重载的本质是函数重载 重载函数的格式: 函数类型 operator 运算符名称(形参表列)  {  重载实体 ...

  3. html5添加视频为背景自动播放

    客户想做个打开官网自动播放一段视频,楼主使用了video标签,即下面的代码:: 于是我在video标签上添加了属性 autoplay=“autoplay” loop=“loop” 然而通过地址栏进去的 ...

  4. MySQL 日期时间相关函数

    第一部分:时间差函数  timestampdiff.datediff.timediff 一.时间差函数:timestampdiff 语法:timestampdiff(interval, datetim ...

  5. ElementUI——报错汇总

    前言 elementUI的报错汇总 错误 please transfer a valid prop path to form item! vue.esm.js?c5de:628 [Vue warn]: ...

  6. SQL中的trim函数

    Oracle TRIM函数是很常见的函数,下面对Oracle TRIM函数的语法作了详尽的阐述说明,希望可以让您对Oracle TRIM函数有更深的认识. 如果提到Oracle TRIM函数,最简单的 ...

  7. axios基本设置

  8. 11-Flutter移动电商实战-首页_屏幕适配方案和制作

    1.flutter_ScreenUtil插件简介 flutter_ScreenUtil屏幕适配方案,让你的UI在不同尺寸的屏幕上都能显示合理的布局. 插件会让你先设置一个UI稿的尺寸,他会根据这个尺寸 ...

  9. Window IDEA开发工具 杀死指定端口 cmd 命令行 taskkill

    Windows平台   两步方法 :  1 查询端口占用,2 强行杀死进程 netstat -aon|findstr "8080" taskkill /pid 4136-t -f ...

  10. C++中继承 声明基类析构函数为虚函数作用,单继承和多继承关系的内存分布

    1,基类析构函数不为虚函数 #include "pch.h" #include <iostream> class CBase { public: CBase() { m ...