router.push 是 Vue Router 实现编程式导航的核心方法，支持字符串路径、对象写法（path+query 或 name+params）、replace/force 控制及相对路径跳转，并返回 Promise 用于错误处理与异步保障。
Vue Router 的 router.push 是实现页面跳转最常用的编程式导航方法，它会在浏览器历史中新增一条记录，支持后退返回。
基础跳转：字符串路径
最简单的方式是传入一个字符串路径，适合无参数的静态跳转：
-
this.$router.push('/home')（Vue 2） -
router.push('/login')（Vue 3，配合useRouter()） - 注意 URL 中不要在
?后加空格，'/user?id=123'✅，'/user? id=123'❌
带参数跳转：对象写法更灵活
传入对象可精确控制路径、参数和查询条件，推荐在复杂场景下使用：
vue-component-analyzer
下载
递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。
- 用
path+query：跳转并附带 URL 查询参数，如{ path: '/order', query: { status: 'paid' } }→/order?status=paid - 用
name+params：需配合命名路由定义，如{ name: 'user', params: { id: '88' } }→/user/88（前提是路由配置了path: '/user/:id'） - ⚠️ 关键限制：
params与path不能共存，若写了path，params会被忽略；必须改用name或拼接完整路径
特殊行为控制
通过额外属性调整导航行为：
立即学习“前端免费学习笔记（深入）”；
-
replace: true：不新增历史记录，等价于点击<router-link replace>，后退时跳过当前页 -
force: true：强制刷新当前相同路由（例如刷新数据），避免 Vue Router 的复用优化 - 相对路径支持：当前在
/user/123/profile时，router.push('posts')跳到/user/123/posts，router.push('../info')跳到/user/123/info
错误处理与异步保障
router.push 返回 Promise，可用于捕获导航结果：
- 成功时执行后续逻辑：
router.push('/dashboard').then(() => { /* 加载完成 */ }) - 失败时判断原因：
.catch(err => { if (err.name === 'NavigationDuplicated') { /* 重复跳转，可忽略 */ } }) - 适用于登录后跳转、表单提交后重定向等需要确认跳转成功的场景
