守卫中断后导航停止，用户停留在当前页；可通过返回false、重定向对象或抛出Error三种方式实现，分别对应地址栏闪退、静默拦截或跳转新页，Vue Router将其视为正常流程分支并生成NavigationFailure对象。
守卫中断后，导航不会继续执行，浏览器地址栏可能短暂变化但会立即回滚到原路由地址，用户停留在当前页面。
中断导航的三种典型方式
守卫可通过以下任一方式中止导航：
-
返回 false：最直接的方式，明确取消本次跳转。例如未登录时
return false，URL 若已被手动修改（如输入新路径后回车），则自动恢复为from对应的地址。 -
返回重定向目标：如
return { name: 'Login' }，当前导航被放弃，立即发起一次新导航，新导航也会走完整守卫流程。 -
抛出 Error：比如权限校验失败时
throw new Error('No permission')，导航终止，并触发router.onError()注册的错误处理回调。
中断后的实际表现
用户感知层面通常有三种情况：
vue-component-analyzer
下载
递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。
- 地址栏闪一下又变回原地址（常见于点击链接后被
return false拦截）； - 页面无任何变化，控制台也无报错（守卫静默返回 false 或未调用 next）；
- 跳转到另一个页面（如登录页），这不是“中断”，而是被重定向——本质是取消原导航、开启新导航。
中断不等于失败，而是流程控制
Vue Router 把这类终止视为正常流程分支，不是异常。它会生成一个 NavigationFailure 对象，含 to 和 from 路由信息，并标记类型为 aborted（主动中断）、cancelled（被新导航覆盖）或 duplicated（目标已是当前页）。可用 isNavigationFailure() 准确识别原因，便于做统一提示或埋点。
立即学习“前端免费学习笔记（深入）”；
注意 next() 的历史遗留问题
在旧版写法中，若使用 next() 参数形式，必须且只能调用一次。重复调用或遗漏调用会导致导航挂起——页面卡住、路由不更新、控制台无报错。新版推荐直接 return 值（如 return { name: 'Home' }），更简洁安全，也避免了这类陷阱。
