绝对路径从根匹配，相对路径基于父级路径拼接；绝对路径如“/settings”始终跳转至根级，相对路径如“profile”则拼接到当前路由父路径末尾，append属性可控制追加行为，router.resolve用于安全预计算路径。
Vue 嵌套路由中，绝对路径和相对路径的跳转行为差异明显，核心在于路径解析起点不同：绝对路径从根（/）开始匹配，相对路径则基于当前路由的 父级路径 拼接。搞清这点，就能避免跳转错乱、404 或白屏。
绝对路径跳转：始终以根为基准
无论当前在哪一层嵌套路由，只要 to 值以 / 开头，Vue Router 就忽略当前上下文，直接从根路径匹配整个路由。
- 例如当前在 /user/123/profile，写
/user/123/settings） - 编程式跳转同理：
this.$router.push('/posts')总是跳到根级 /posts - 适合全局导航（如顶部菜单）、脱离当前嵌套结构的跳转
相对路径跳转：依赖当前路由层级
不以 / 开头的路径，会被自动拼接到当前路由的 父路径末尾（不含动态参数部分），这是嵌套路由“相对性”的关键逻辑。
Springboot Vue Builder
下载
从零开始编排 SpringBoot+Vue 全栈项目工作流，适用于新建全栈项目或完整脚手架请求，触发后依次调用 product‑spec‑builder（需求调研）等模块。
- 当前在 /user/123，
- 当前在 /user/123/edit，
- 当前在 /admin/logs/detail/456，
to="export"→ 跳到 /admin/logs/detail/export（不是预期的/admin/logs/export）——这里容易出错，需注意子路由是否配置在正确层级
用 append 属性控制相对拼接行为
默认情况下，相对路径会替换当前路由的“最后一段”；加 append 后，则变成“追加”到当前完整路径后（类似文件系统中的 cd）。
- 当前在 /user/123，
- 当前在 /user/123/login，
/user/dashboard） - 注意：
append对绝对路径无效，只影响相对路径解析
router.resolve 辅助安全计算目标路径
当路径逻辑复杂（比如动态拼接、权限判断后跳转），建议用 router.resolve() 预先算出最终路径，再执行跳转，避免运行时错误。
- 例如：
const resolved = this.$router.resolve({ name: 'UserProfile', params: { id: 123 } })→ 返回含href和location的对象 - 可用于生成外部链接、新窗口打开、或校验路径是否存在后再跳转
- 配合
append: true参数，可精确模拟 router-link 的相对行为
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
