vue router.push 传参数

作者：メ可遇不可求发布日期:2026-03-21 浏览:41

// 使用 vue-router 的 push 方法传递参数

// 假设我们有一个路由配置如下：
const routes = [
  {
    path: '/user/:id',
    name: 'user',
    component: UserComponent
  }
]

// 在组件中使用 push 方法传递参数：

// 1. 通过路径传递参数
this.$router.push('/user/123'); // 直接在路径中传递参数

// 2. 使用命名路由并传递参数
this.$router.push({ name: 'user', params: { id: 123 } }); // 通过命名路由传递参数

// 3. 传递查询参数
this.$router.push({ path: '/user', query: { id: 123 } }); // 通过查询参数传递

// 解释：
// - 第一种方式是直接在路径中传递参数，适用于简单的场景。
// - 第二种方式使用命名路由和 params 对象传递参数，适合更复杂的路由配置。
// - 第三种方式通过 query 参数传递，会在 URL 中显示为查询字符串（如 ?id=123）。

上一篇：vue img

下一篇：vue3 shallowref