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

相关推荐
zzqssliu18 分钟前
反向海淘跨境代购系统架构设计:基于Laravel+Vue+React的实战拆解
vue.js·系统架构·laravel
Python私教38 分钟前
从主题闪烁到 Markdown 阅读体验:RuyiBlog v0.1.1 的前端实现复盘
前端·状态模式
SuperEugene39 分钟前
菜单架构设计:递归渲染、权限过滤、多级菜单与面包屑统一|权限与菜单架构篇
前端·vue.js·架构
边界条件╝40 分钟前
Pinia 深度使用实战
前端·vue.js
英俊潇洒美少年42 分钟前
前端 Jest 单元测试零基础实战:模板、提效、避坑、面试题(Vue 项目可用)
前端·vue.js·单元测试
和blue一起变得更好1 小时前
周三:Vue3高级组件特性
前端·javascript·vue.js
happyprince1 小时前
10-Hugging Face Transformers 量化系统深度分析
java·前端·数据库
AskHarries1 小时前
如何使用 OpenClaw Skill
前端
AI周红伟1 小时前
Agent Skills生产级Skills 案例实操-周红伟
前端·chrome·react.js·langchain
Java编程爱好者1 小时前
Spring AI 1.0 实战:从原理到落地的完整指南
javascript