next是导航决议函数，决定放行、重定向、取消或报错；必须且仅调用一次，分清next()、next(false)、next('/path')、next({path, replace: true})四种行为，防死循环需判断目标路径，动态路由需兜底或等待就绪。
Vue 路由守卫中，next 不是“跳转函数”，而是“导航决议函数”——它决定当前这次导航的最终命运：放行、重定向、取消，或报错。用错 next，就会卡住、循环、白屏。
next() 的四种行为必须分清
每种调用方式对应一种明确的导航意图，不能混用：
- next()：允许当前导航继续，走原定路线（如 /user → /profile），进入下一个守卫或渲染组件
- next(false)：立即终止本次导航，URL 不变，页面停留不动（适合无权限且不想暴露登录页的场景）
- next('/login') 或 next({ path: '/login' })：中断当前导航，发起一次全新导航；但若不加路径判断，极易触发死循环
- next({ path: '/login', replace: true })：跳转同时替换当前 history 记录，避免用户点返回回到空白页或非法状态
防死循环的关键：跳转前先判断目标路径
比如登录校验，不能无条件执行 next('/login')：
Springboot Vue Builder
下载
从零开始编排 SpringBoot+Vue 全栈项目工作流，适用于新建全栈项目或完整脚手架请求，触发后依次调用 product‑spec‑builder（需求调研）等模块。
- 错误写法：
if (!isLogin) next('/login')→ 每次都触发新导航，新导航又进守卫，无限套娃 - 正确写法：
if (!isLogin && to.path !== '/login') { next('/login') } else { next() } - 更稳妥还可加 query 参数记录来源：
next({ path: '/login', query: { redirect: to.fullPath } })
所有分支都必须调用 next，一次且仅一次
这是最容易忽略却最致命的规则。只要进了守卫，就必须有且仅有一次 next 调用，否则导航会挂起、页面卡死：
- 不能写成：
if (to.meta.requiresAuth && !token) next('/login'); next()→ 未登录时 next 被调两次 - 必须包在 if-else 或 switch 中，确保每个逻辑出口都有 next，例如：
if (token) next()
else next('/login')
} else {
next()
}
动态路由或异步加载时的额外注意
使用 router.addRoute() 添加新路由后，首次访问可能因路由未就绪而匹配失败：
- 可在 beforeEach 中兜底：
if (!router.hasRoute(to.name)) next('/404') - 或等待路由加载完成：
router.isReady().then(() => { /* 守卫逻辑 */ }) - 组件内守卫（
beforeRouteLeave）对to.fullPath更敏感，跳转需严格比对，避免误重定向
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
