router.push(‘/‘)跳转不触发重定向

我来帮你分析为什么 router.push('/') 没有按照预期跳转到 /fenlei 路径。

首先让我查看相关的代码文件:

javascript 复制代码
router/index.js
  {
    path: '/',
    component: Layout,
    redirect: '/fenlei'
  },

已查看文件 index.vue 225-240

已查看文件 index.js 65-85

现在让我查看更多上下文,了解这个函数的完整逻辑:

已查看文件 index.vue 210-236

现在我明白问题所在了!让我解释一下:

问题分析

router.push('/') 没有跳转到 /fenlei 的原因是:

redirect 配置只在路由匹配时生效,而 router.push() 是编程式导航,不会触发重定向。

具体来说:

  1. 路由配置中的 redirect :在 router/index.js 中,/ 路径配置了 redirect: '/fenlei',这意味着当用户直接访问 / 时,会自动重定向到 /fenlei

  2. router.push('/') 的行为 :在 TagsView/index.vue(file://E:\JavaProject\sxcm-relic-platform\ruoyi-ui\src\layout\components\TagsView\index.vue) 的 233 行,使用 router.push('/')编程式导航 ,它会直接导航到 / 路径,而不会触发路由配置中的 redirect

  3. Vue Router 的机制redirect 配置只在 URL 匹配路由时自动触发,而通过 router.push()router.replace() 等编程式导航方法调用时,如果路径已经匹配成功,就不会再触发重定向。

解决方案

有两种方式可以解决这个问题:

方案 1:直接跳转到 /fenlei(推荐)

修改 TagsView 组件,直接跳转到目标路径:

vue 复制代码
router.push('/fenlei')
相关推荐
程序员黑豆6 小时前
Java类型推断完全指南:从var到菱形运算符,掌握使用限制与最佳实践
java·前端·ai编程
To_OC7 小时前
踩了个 TS 的坑之后,我终于把 type 和 interface 掰明白了
前端·react.js·typescript
GreenTea7 小时前
深度解读 Anthropic 多智能体报告:更强的模型 ≠ 更好的协调
前端·后端·算法
浮生望7 小时前
前端API工程化:用 Mock 数据与 Axios 配置实现独立于后端的并行开发
前端
2603_965148117 小时前
如何解析JSON数据?API返回的商品信息处理教程
开发语言·数据库·python·自动化·json·api
万少8 小时前
给 DeepSeek Harness 装个"应用商店":一条命令,595 个插件随你逛
前端·javascript·后端
波波0078 小时前
C# 15 重磅新特性: 带标签 break 与 continue:重新定义嵌套循环控制流
服务器·前端·c#
Brown.alexis9 小时前
es6知识点1-自备使用
前端·ecmascript·es6
小爬的老粉丝9 小时前
JavaScript 纯前端预览 WPS:先识别容器,再路由解析器
前端·javascript·wps
知无不研10 小时前
lambda表达式的使用(3)
开发语言·c++·lambda