重定向是强制跳转且URL地址改变,适用于旧路径停用、登录后跳首页等场景;别名是语义映射且URL不变,适用于SEO、多语言路由等需保留原始路径的情况。

重定向:强制跳转,URL 地址会变
重定向适用于“访问 A 就必须去 C”的场景,比如旧路径停用、登录后强制跳转首页、或统一处理带斜杠和不带斜杠的请求。
配置方式很简单,在路由对象中加 redirect 字段:
-
{ path: '/home', redirect: '/' }—— 访问/home会立刻跳到/,地址栏变成/ -
{ path: '/user', redirect: { name: 'UserProfile' } }—— 跳转到命名路由,更灵活、解耦更强 -
{ path: '/old', redirect: to => ({ path: '/new', query: { from: 'old' } }) }—— 函数式重定向,可动态计算目标路径,适合带参数的复杂跳转
别名:语义映射,URL 地址不变
别名不是跳转,而是“同一个页面,多个入口”。用户访问别名路径时,地址栏保持原样,但内部按目标路由匹配组件和逻辑。
典型用途包括:SEO 友好路径、兼容历史链接、多语言路由(如 /en/about 和 /zh/关于 映射同一组件)。
从零开始编排 SpringBoot+Vue 全栈项目工作流,适用于新建全栈项目或完整脚手架请求,触发后依次调用 product‑spec‑builder(需求调研)等模块。
-
{ path: '/', component: Home, alias: '/index' }—— 访问/index页面内容是 Home,地址栏仍显示/index -
{ path: '/product/:id', component: Product, alias: ['/goods/:id', '/item/:id'] }—— 支持多个别名,都共享相同参数解析 -
{ path: 'profile', component: Profile, alias: 'me' }—— 相对别名,若父路由是/user,则/user/me匹配该路由
默认首页设置:两种常用方式
用户打开域名(如 https://example.com/)时,希望直接展示首页,而不是空白或 404。这通常靠根路径 / 的路由定义实现。
- 最直接:在 routes 中明确写
{ path: '/', component: Home } - 配合重定向:如果首页实际对应的是
/dashboard,可设{ path: '/', redirect: '/dashboard' } - 避免歧义:不要给
/同时设component和redirect,行为不可预测;也不建议用别名代替根路径定义,默认页应有明确的 path
重定向 vs 别名:选哪个?看 URL 是否需要保留
核心判断标准就一条:用户是否应该看到当前访问的路径?
- 要保留原始路径(比如分享链接、SEO、历史记录需准确)→ 用 alias
- 必须统一到新路径(比如废弃旧地址、权限拦截后跳转)→ 用 redirect
- 别名不能嵌套生效,重定向可以链式触发(A → B → C),但要注意循环重定向报错
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!










