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的大小.个数和页面加载速度的 ...
随机推荐
- pandas 字典创建Dataframe
所有的ndarrays必须具有相同的长度.如果传递了索引(index),则索引的长度应等于数组的长度.如果没有传递索引,则默认情况下,索引为range(n),其中n为数组长度. import pand ...
- Notepad正则表达式用法
https://blog.csdn.net/cuckoo1/article/details/52165449
- 【解惑】介绍三大数据库的with语句的写法及使用场景
WITH 子句通常被称为 "Common Table Expressions"(CTE),俗称内存临时表,当使用 WITH 语句时,应注意具体的数据库版本和支持情况.以下是对 My ...
- JVM性能监控和调优
JVM性能监控和调优 JVM(Java虚拟机)调优是为了优化Java应用程序的性能和稳定性.JVM调优的目的是通过调整JVM的配置参数和优化应用程序代码,使其在给定的硬件和软件环境下达到更好的性能表现 ...
- Nginx反向代理服务流式输出设置
Nginx反向代理服务流式输出设置 1.问题场景 提问:为什么我部署的服务没有流式响应 最近在重构原有的GPT项目时,遇到gpt回答速度很慢的现象.在使用流式输出的接口时,接口响应速度居然还是达到了3 ...
- Python 潮流周刊#16:优雅重要么?如何写出 Pythonic 的代码?
你好,我是猫哥.这里每周分享优质的 Python.AI 及通用技术内容,大部分为英文.标题取自其中两则分享,不代表全部内容都是该主题,特此声明. 本周刊由 Python猫 出品,精心筛选国内外的 25 ...
- 【路由器】OpenWrt 手动编译 ipk
目录 .ipk 文件 编译准备 编译 .ipk 文件 更新 feeds 配置平台 获取交叉编译链 添加需要编译的第三方软件包 参考资料 .ipk 文件 .ipk 文件是可以通过 OpenWrt 的包管 ...
- 原神盲盒风格:AI绘画Stable Diffusion原神人物公仔实操:核心tag+lora模型汇总
本教程收集于:AIGC从入门到精通教程汇总 在这篇文章中,我们将深入探讨原神盲盒的艺术风格,以及如何运用AI绘画技术(Stable Diffusion)--来创造原神角色公仔.我们将通过实践操作让读者 ...
- java与es8实战之五:SpringBoot应用中操作es8(带安全检查:https、账号密码、API Key)
欢迎访问我的GitHub 这里分类和汇总了欣宸的全部原创(含配套源码):https://github.com/zq2599/blog_demos 本篇概览 本篇是<java与es8实战>系 ...
- OpenStack-T版+Ceph
OpenStack OpenStack 中有哪些组件 keystone:授权 [授权后各个组件才可以进行相应的功能] Keystone 认证所有 OpenStack 服务并对其进行授权.同时,它也是所 ...