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

相关推荐
夜郎king2 小时前
湖南高考天气查询:基于 HTML5 与百度天气 API 实现页面展示
前端·html5·百度天气实践·天气信息可视化
云水一下9 小时前
TypeScript 从零基础到精通(五):高级类型与泛型
前端·javascript·typescript
counterxing9 小时前
vibe coding 之后,我更不想打字了
前端·agent·ai编程
云水一下9 小时前
TypeScript 从零基础到精通(六):类型声明与模块化
javascript·typescript
copyer_xyf9 小时前
Python 模块与包的导入导出
前端·后端·python
研☆香9 小时前
es6新特性功能介绍(四)
前端·ecmascript·es6
微扬嘴角9 小时前
React篇1--JSX语法规则、组件、组件实例的3大特性
前端·react.js·前端框架
copyer_xyf10 小时前
Python venv 虚拟环境
前端·后端·python
无聊的老谢10 小时前
Vue 3 + TypeScript 构建大型电信运维平台的前端架构设计
前端·vue.js·typescript
xiaofeichaichai10 小时前
Map / Set / WeakMap / WeakSet
前端·javascript