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')
相关推荐
xieliyu.3 小时前
Java算法精讲:双指针(二)
java·开发语言·算法
云水一下4 小时前
TypeScript 从零基础到精通(五):高级类型与泛型
前端·javascript·typescript
何以解忧,唯有..4 小时前
Python包管理工具pip:从入门到精通
开发语言·python·pip
counterxing4 小时前
vibe coding 之后,我更不想打字了
前端·agent·ai编程
雪的季节4 小时前
RabbitMQ详解
开发语言
云水一下4 小时前
TypeScript 从零基础到精通(六):类型声明与模块化
javascript·typescript
copyer_xyf4 小时前
Python 模块与包的导入导出
前端·后端·python
研☆香4 小时前
es6新特性功能介绍(四)
前端·ecmascript·es6
微扬嘴角4 小时前
React篇1--JSX语法规则、组件、组件实例的3大特性
前端·react.js·前端框架
ice8130331815 小时前
【Python】Matplotlib折线图绘制
开发语言·python·matplotlib