vue3 router.push传参

作者：硝烟发布日期:2025-08-08 浏览:18

// 在 Vue 3 中使用 router.push 传参的示例

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

// 创建路由器实例
const router = VueRouter.createRouter({
  history: VueRouter.createWebHistory(),
  routes
});

// 在组件中使用 router.push 传参
this.$router.push({ 
  name: 'user', 
  params: { id: 123 } 
});

// 如果你想传递查询参数，可以这样做：
this.$router.push({ 
  path: '/user', 
  query: { id: 123 } 
});

// 解释说明：
// 1. 使用 `name` 和 `params` 传参时，参数会作为路径的一部分。
// 2. 使用 `path` 和 `query` 传参时，参数会以查询字符串的形式附加在 URL 后面。

上一篇：vue3 use

下一篇：vue3 script setup语法糖