vue-router重写push方法,解决相同路径跳转报错,解决点击菜单栏打开外部链接
修改vue-router的配置文件,默认位置router/index.js
import Vue from 'vue'
import Router from 'vue-router' /**
* 重写路由的push方法
* 解决,相同路由跳转时,报错
* 添加,相同路由跳转时,触发watch (针对el-menu,仅限string方式传参,形如"view?id=5")
*/ // 保存原来的push函数
const routerPush = Router.prototype.push
// 重写push函数
Router.prototype.push = function push(location) { // 这个if语句在跳转相同路径的时候,在路径末尾添加新参数(一些随机数字)
// 用来触发watch
if(typeof(location)=="string"){
var Separator = "&";
if(location.indexOf('?')==-1) { Separator='?'; }
location = location + Separator + "random=" + Math.random();
} // 这个语句用来解决报错
// 调用原来的push函数,并捕获异常
return routerPush.call(this, location).catch(error => error)
} Vue.use(Router) export default new Router({
routes: [
{
path: '/', }
]
})
/ 如果你的改了push还是没有生效,可以考虑改replace方法
// 修改路由replace方法,阻止重复点击报错
const originalReplace = VueRouter.prototype.replace;
VueRouter.prototype.replace = function replace(location) {
return originalReplace.call(this, location).catch(err => err);
};
vue解决点击菜单栏跳转外部链接
const VueRouterPush = Router.prototype.push
Router.prototype.push = function push (location) {
console.log(location)
let user = ''
if(window.sessionStorage.getItem('user')){
user = JSON.parse(window.sessionStorage.getItem('user')).roles[0].roleName
}
console.log(typeof(location))
if(typeof(location) == "string"){
if(location.indexOf('http') == 0){
if(user == '超级权限'){
var Separator = "&";
if(location.indexOf('?')==-1) { Separator='?';}
location = location + '#/login' + Separator + 'key=123456';
window.open(location)
}else{
location = location + '#/login';
window.open(location)
}
}else{
return VueRouterPush.call(this, location).catch(err => err)
}
}else{
return VueRouterPush.call(this, location.path).catch(err => err)
}
}
vue-router重写push方法,解决相同路径跳转报错,解决点击菜单栏打开外部链接的更多相关文章
- vue路由跳转报错解决
vue路由跳转: setTimeout(function () { console.log(this); this.$router.push("/login"); },800) 语 ...
- 10. vue axios 请求未完成时路由跳转报错问题
axios 请求未完成时路由跳转报错问题 前两天项目基本功能算是完成了,在公司测试时遇到了遇到了一个问题,那就是在请求未完成时进行路由跳转时会报错,想了几种办法来解决,例如加loading,请求拦截, ...
- Pyqt 打开外部链接的几种方法
Pyqt 触发一个事件,打开外部链接,我找到了这个方法,供大家参考 1. QDesktopServices 的openUrl 方法 QtGui.QDesktopServices.openUrl(QtC ...
- push方法的页面间跳转--
一,自定义动画写push方法-- 添加coreGraphics.framework框架 在CATransitionAnimation.h文件里面引入-- #import <QuartzCore/ ...
- Vue+DataTables warning:table id=xxxx -Cannot reinitialize DataTable.报错解决方法
问题描述: 使用DataTables来写列表,用vue来渲染数据,有搜索功能,每次点击搜索就会报错,如下图所示. 问题排查: 找了一系列原因,最后发现是我每次请求完数据之后都会添加分页功能,从而导致了 ...
- Vue router拦截 如果用户并未登录直接跳转到登录界面(最简单的cookie演示)
router.beforeEach(function(to,from,next){ console.log('路由拦截') console.log(to.name) console.log(from. ...
- vue router 中,children 中 path 为空字符串的路由,是默认打开的路由(包括在 el-tabs 中嵌套路由的情况)
详见该页面的最后一个代码块:https://router.vuejs.org/zh/guide/essentials/nested-routes.html#%E5%B5%8C%E5%A5%97%E8% ...
- Vue 路由跳转报错 Error: Avoided redundant navigation to current location: "/XXX".
在router文件夹下的index.js中加入红色字体代码即可解决 import Vue from 'vue' import VueRouter from 'vue-router' Vue.use(V ...
- Vue Router 常见问题(push报错、push重复路由刷新)
Vue Router 常见问题 用于记录工作遇到的Vue Router bug及常用方案 router.push报错,Avoided redundant navigation to current l ...
- Vue Router的懒加载路径
单页应用产出的入口chunk大小随着业务的复杂度线性增加,导致后期加载速度越来越慢.后面就需要对不同路径下的模块进行拆分,打包到相应的chunk下,按需加载,找到chunk的大小.个数和页面加载速度的 ...
随机推荐
- 关于 Task 简单梳理(C#)【并发编程系列】
〇.前言 Task 是微软在 .Net 4.0 时代推出来的,也是微软极力推荐的一种多线程的处理方式. 在 Task 之前有一个高效多线程操作类 ThreadPool,虽然线程池相对于 Thread, ...
- idea 2021新窗口打开工程
描述 Mac M1,IDEA 2017 有部分兼容性问题,遂对IDEA进行升级 idea 升级2021(IntelliJ IDEA 2021.3 (Community Edition)) 打开新工程, ...
- [Lua] IT技术熟练度生成器 | 根据IT活动记录生成md表格 | 自创
IT技术熟练度 v1.0 为衡量个人能力水平自创的一套评分机制,根据时间.代码行数.基础理论三个变量生成.最近在学lua,正好练下基本功.效果可见 个人介绍 | 代码统计 - 小能日记 - 博客园 ( ...
- Kioptrix: Level 1 (#1) 古老的Apache Samba VULN
0×01 Vulnhub靶机渗透总结之 Kioptrix: Level 1 (#1) 系列专栏:Vulnhub靶机渗透系列 欢迎大佬:点赞️收藏关注 首发时间: 2023年8月20日 如有错误 还望告 ...
- KRPano插件解密大师更新支持最新版KRPano的XML/JS解密
KRPano插件解密大师是一款专业的全景解密工具,它可以帮助你轻松解密KRPano的XML/JS插件,还能分析下载静态和动态网站的资源.你无需任何编程知识,只需一键点击,就能快速完成解密,学习全景开发 ...
- Python 潮流周刊第 20 期(摘要)
你好,我是猫哥.本周刊分享优质的 Python.AI 及通用技术内容,大部分为英文.这里是标题摘要版,查看全文请至☞:https://pythoncat.top/posts/2023-09-16-we ...
- LeetCode 周赛上分之旅 #47 前后缀分解结合单调栈的贡献问题
️ 本文已收录到 AndroidFamily,技术和职场问题,请关注公众号 [彭旭锐] 和 BaguTree Pro 知识星球提问. 学习数据结构与算法的关键在于掌握问题背后的算法思维框架,你的思考越 ...
- 专为小白打造—Kafka一篇文章从入门到入土
一.什么是Kafka MQ消息队列作为最常用的中间件之一,其主要特性有:解耦.异步.限流/削峰. Kafka 和传统的消息系统(也称作消息中间件)都具备系统解耦.冗余存储.流量削峰.缓冲.异步通信.扩 ...
- 连接远程MySQL报错问题-Datagrip
前言: 记录:DataGrip连接远程服务器MySQL数据库报错问题. 问题: 1.Communications link failure--会话连接失败 原因分析: 1.端口被防火墙了 2.MySQ ...
- .NET 数据库大数据 方案(插入、更新、删除、查询 、插入或更新)
1.功能介绍 (需要版本5.0.45) 海量数据操作ORM性能瓶颈在实体转换上面,并且不能使用常规的Sql去实现 当列越多转换越慢,SqlSugar将转换性能做到极致,并且采用数据库最佳API 操作数 ...