Nuxt v3调用router.push/replace时路由失效，页面卡顿求助

操作层面排查点 #

• 检查路由跳转前的阻塞逻辑：查看全局路由中间件、页面的beforeEnter守卫里是否有大量同步计算、未正确await的异步操作，这类逻辑会直接阻塞路由跳转流程。
• 排查路由参数：避免在router.push/replace的state中传递超大体积数据，序列化这类数据会占用大量资源，引发跳转卡顿。
• 目标页面渲染逻辑：检查跳转目标页面的onMounted/onBeforeMount钩子，是否存在未优化的重计算、批量DOM操作或同步数据请求，这些会导致跳转后页面渲染阻塞，表现为跳转时卡顿。

框架层面排查点 #

• 禁用实验性路由特性：在nuxt.config.ts中尝试关闭experimental.payloadExtraction，部分版本的该特性可能引发资源竞争，导致跳转卡顿。
• 关闭开发环境性能监控：DevTools的性能面板或Nuxt DevTools的某些监控功能，可能在开发环境拖慢路由跳转，关闭后再测试。
• 排查依赖冲突：临时移除第三方路由相关插件（如多语言插件、权限插件）或重型UI库，测试是否是依赖与Nuxt 3.14路由逻辑不兼容导致的问题。

无刷新跳转替代方案 #

可以尝试使用Nuxt官方封装的navigateToAPI替代原生router方法，它做了框架级优化：

// 对应router.replace
await navigateTo('/target-page', { replace: true })
// 对应router.push
await navigateTo('/target-page')

若navigateTo仍出现卡顿，基本可以排除路由API本身的问题，重点排查页面渲染或前置业务逻辑。

内容的提问来源于stack exchange，提问作者Visovan Mihai