vue -- router路由跳转错误 , NavigationDuplicated
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的更多相关文章
- vue router路由跳转了,但是页面没有变(已解决)
小白学习 router.js:两个组件之间跳转 但是路由变了,页面没有改变的原因是因为app.vue里面没有router-view(很关键)
- Vue.之.路由跳转
Vue.之.路由跳转 在进行项目开发的过程中,需要使用路由进行跳转.如下: // 不带有参数,在页面上跳转到别的页面 1. this.$router.push('/login/init'); // ...
- 前端MVC Vue2学习总结(八)——Vue Router路由、Vuex状态管理、Element-UI
一.Vue Router路由 二.Vuex状态管理 三.Element-UI Element-UI是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架,手机端有对应框架是 Mint U ...
- Vue Router路由守卫妙用:异步获取数据成功后再进行路由跳转并传递数据,失败则不进行跳转
问题引入 试想这样一个业务场景: 在用户输入数据,点击提交按钮后,这时发起了ajax请求,如果请求成功, 则跳转到详情页面并展示详情数据,失败则不跳转到详情页面,只是在当前页面给出错误消息. 难点所在 ...
- Vue系列:Vue Router 路由梳理
Vue Router 是 Vue.js 官方的路由管理器.它和 Vue.js 的核心深度集成,让构建单页面应用变得易如反掌.包含的功能有: 嵌套的路由/视图表 模块化的.基于组件的路由配置 路由参数. ...
- Vue之路由跳转 传参 aixos 和cookie
一.路由跳转 1.1 项目的初始化 vue create m-proj >>>创建vue项目 精简vue项目的 views 视图 About(基本是删除的) Home.(可以 ...
- vue设置路由跳转参数,以及接收参数
最近做Vue项目,遇到了一个路由跳转问题:首页要跳转到项目页指定的Tab选项卡项,一开始总是跳到默认项.解决方法如下: 在跳转链接处设置了路由跳转参数,如下: <router-link :to ...
- vue二级路由跳转后外部引入js失效问题解决方案
vue路由可以通过children嵌套,于是可以形成二级路由等等... 案例如下: routes: [ { path: '/', name: 'dy', component: dy, children ...
- 04 Vue Router路由管理器
路由的基本概念与原理 Vue Router Vue Router (官网: https://router.vuejs.org/zh/)是Vue.js 官方的路由管理器. 它和vue.js的核心深度集成 ...
随机推荐
- CentOS7安装Supervisor3.1.4
supervisord 负责管理进程的server端,配置文件是/etc/supervisor/supervisord.conf supervisorctl client端的命令行工具,管理子进程,配 ...
- git提交项目到已有库
借鉴地址:https://blog.csdn.net/jerryhanjj/article/details/72777618 Git global setup git config --global ...
- Zabbix4.0国内下载源
国内zabbix源总结 目前发现的有以下几个站点: 1.阿里巴巴开源镜像站(推荐使用) 地址:https://mirrors.aliyun.com/zabbix/ 2.华为开源镜像站(推荐使用) 地址 ...
- LeetCode 1048. Longest String Chain
原题链接在这里:https://leetcode.com/problems/longest-string-chain/ 题目: Given a list of words, each word con ...
- React-Redux常见API
React-Redux是在Redux的基础上,将其大量重复的代码进行了封装. 1. Provider 利用context对象给所有子组件提供store.不再需要在每个组件都引用store. impor ...
- 从.NET/CLR返回的hresult:0x8013XXXX的解释
什么是0x8013XXXX 有时您可能会遇到从.NET返回的神秘HRESULT,它以0x8013开头,例如0x80131522.不幸的是,Visual Studio附带的错误查找并不能真正处理那些奇怪 ...
- hasura skor 一个pg 的event trigger 扩展
hasura skor 是一个hasura 团队早期的event triggerpg 扩展,新的推荐使用graphql engine 参考架构 缺点 只有在skor 运行的时候,数据才可以被捕捉处理 ...
- repo源
[sdata-base] name=Base baseurl=http://xx.xx.xx.xx:4507/repo/$releasever/$basearch/base enabled=1 gpg ...
- 洛谷 P1629 邮递员送信 题解
P1629 邮递员送信 题目描述 有一个邮递员要送东西,邮局在节点1.他总共要送N-1样东西,其目的地分别是2~N.由于这个城市的交通比较繁忙,因此所有的道路都是单行的,共有M条道路,通过每条道路需要 ...
- 【loj3119】【CTS2019】随机立方体
题目 一个 $ n m l $ 的立方体等概率填入 $ 1-nml $ ; 定义一个位置是极大的当且仅当这个位置比三位坐标的至少一维与之相等的位置的值都大. 询问极大值恰好有\(k\)个的 ...