[Vue]防止路由重复跳转

Vue防止路由重复跳转

js 复制代码
// 获取当前路由的原始路径(包括重定向的处理)
const currentPath = this.$route.redirectedFrom || this.$route.path;

// 判断目标路径是否与当前路径相同
if (currentPath !== item.url) {
  this.$router.push({ path: item.url });
} else {
  console.log('目标页面与当前页面相同,不进行跳转');
}
  • this.$route.redirectedFrom

重定向的来源

  • this.$route.path

this.$route.path:这是当前路由的路径(不包括查询参数和哈希)。它表示的是当前页面的实际路径,比如 /strategy/security-policy。当路由发生重定向时,this.$route.path 会反映最终的目标路径(即重定向后的路径)

  • this.$route.fullPath

这是当前路由的完整路径,包含路径、查询参数和哈希。例如,/strategy/security-policy?id=123#section1。如果路由发生了重定向,fullPath 也会是重定向后的路径。

相关推荐
coderCN4 分钟前
Nodejs path OS process child_process FS crypto zlib ffmpeg Markdown 转 html
前端
七牛开发者7 分钟前
拆解 dsh:Session 的事件溯源与状态重建
javascript·github·agent
梨想橙汁11 分钟前
JS BOM 浏览器对象:定时器与同步异步底层理解
前端·javascript
吴长建先生13 分钟前
支付回调接口设计与代码规范:如何提升团队工程化能力
vue.js
梨想橙汁17 分钟前
ES6+ 必用新特性:箭头函数、解构、模板字符串、扩展运算符
前端·javascript
梨想橙汁18 分钟前
DOM 与 JS 事件:页面元素操作、事件冒泡、事件委托实战
前端·javascript
Dreams°12333 分钟前
【React+TS+ECharts可视化避坑:图表空白、不实时更新、数据池堆积卡顿完整复盘(附完整源码)】
前端·react.js·echarts
计算机魔术师36 分钟前
三年前估值45亿,现在129亿——Hugging Face凭什么被老黄盯上?
前端
一个游离的指针37 分钟前
浏览器的渲染原理
前端·javascript
zttbee42 分钟前
vue2的API大白话讲解
前端·vue.js·前端框架