[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 也会是重定向后的路径。

相关推荐
OPHKVPS18 分钟前
黑客反被黑:研究人员利用 XSS 漏洞劫持 StealC 控制面板,窃取攻击者情报
前端·网络·npm
whyfail1 小时前
Pretext:告别DOM重排,让文本布局飞起来
前端·dom
楚轩努力变强1 小时前
2026 年前端破局:从页面开发到前端隐私计算全链路架构师,构建原生数据安全合规体系
前端·国密算法·数据安全合规·前端安全·web crypto api·前端隐私计算·2026前端趋势
敲敲了个代码1 小时前
React 那么多状态管理库,到底选哪个?如果非要焊死一个呢?这篇文章解决你的选择困难症
前端·javascript·学习·react.js·前端框架
yungcy61632 小时前
React性能优化实战:从卡顿到丝滑,15个核心技巧覆盖全场景
前端·react.js·性能优化
阿珊和她的猫2 小时前
React 中 CSS 书写方式全解析
前端·css·react.js
打瞌睡的朱尤2 小时前
js复习--考核
开发语言·前端·javascript
前端极客探险家2 小时前
React 全面入门与进阶实战教程
前端·javascript·react.js
儒雅的烤地瓜2 小时前
Vue | 一文详解Vue3中的Setup()函数
vue.js·vue3·vue2·组合式api·setup函数·option api