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的大小.个数和页面加载速度的 ...
随机推荐
- 银河麒麟等 Linux系统 安装 .net 5,net 6及更高版本的方法
最近项目上用到 银河麒麟的操作系统,需要搭建 .net 跨平台方案.一开始使用各种命令都安装不上,很多提示命令找不到,或者下载包时候网络无法下载. 网上教程很多,但没有一个是成功的,多数使用 apt ...
- 了解 HarmonyOS
引言 在开始 HarmonyOS 开发之前,了解其背景.特点和架构是非常重要的.本章将为你提供一个全面的 HarmonyOS 概览. 目录 什么是 HarmonyOS HarmonyOS 的发展历程 ...
- API接口获取的商品详情该如何使用
获取到商品API接口返回的商品详情数据后,我们可以将其用于以下方面: 商品展示:通过获取到的商品详情数据,我们可以展示商品信息,包括商品名称.价格.商品图片.描述等信息.我们可以将这些信息显示在商品详 ...
- GORM自定义Gorm.Model实现自动添加时间戳
废话不说直接开始 官网(http://gorm.io)有给出一套默认的gorm.Model模型,定义如下 package gorm import "time" // Model b ...
- 初露头角!Walrus入选服贸会“数智影响力”数字化转型创新案例
9月5日,由北京市通信管理局.工业和信息化部新闻宣传中心联合主办的"企业数字化转型论坛"在2023中国国际服务贸易交易会期间召开,论坛以"数字化引领 高质量发展" ...
- Record - Nov. 27st, 2020 - Exam. REC & SOL
Problem. 1 Junior - Thinking Desc. & Link. 注意到值域乘范围刚好能过. 然后就存两个桶即可...(数组开小飞了半天才调出来...) Problem. ...
- 慢SQL原因分析之索引失效
现象 最近收到一个慢sql工单,慢sql大概是这样:"select xxx from tabel where type = 1". 咦,type字段明明有索引啊,为啥是慢sql呢? ...
- oracle 问题:ORA-28040:没有匹配的验证协议
Oracle11g客户端连接Oracle12C服务器端,需配置项 前置条件:已安装Oracle11g客户端,配置好环境变量,用PL/SQL Developer登录数据库 出现问题:登录数据库时,提示& ...
- Springboot实现注解判断权限
Springboot实现注解判断权限 今天记录一下使用springboot的注解来给方法加权限 避免了每个方法都需要大量的权限判断 超级好用√ @ 目录 Springboot实现注解判断权限 1.创建 ...
- c语言代码练习4(改进)
#define _CRT_SECURE_NO_WARNINGS 1 #include <stdio.h> #include <string.h> #include <wi ...