$router.push动态传递多个参数

在Vue.js中，可以使用$router.push方法来进行路由跳转。如果要传递多个参数，可以按照以下方式进行：

this.$router.push({
  name: 'targetRoute',
  params: {
    param1: value1,
    param2: value2,
    // ...
  }
})

其中，name是目标路由的名称，params是一个对象，包含要传递的多个参数和对应的值。在目标路由中，可以通过$route.params来获取传递过来的参数。

例如，在目标路由中可以这样获取参数：

const param1 = this.$route.params.param1;
const param2 = this.$route.params.param2;
// ...

相关问题

$router.push传递多个参数

$router.push方法可以通过传递一个对象来传递多个参数。该对象包含了路由的路径和需要传递的参数。

例如：

this.$router.push({
  path: '/user',
  query: { name: 'John', age: 30 }
})

在这个例子中，$router.push方法传递了一个对象，其中包含了路由的路径为'/user'，并且传递了两个参数name和age，它们的值分别为'John'和30。

在接收路由参数的页面中，可以使用$route对象来获取这些参数。例如：

<template>
  <div>
    <h1>Hello {{ $route.query.name }}!</h1>
    <p>You are {{ $route.query.age }} years old.</p>
  </div>
</template>

在这个例子中，$route.query对象包含了传递的参数，可以通过它们的属性名来获取参数的值。

如何通过this.$router.push传递参数

在Vue.js中，`this.$router.push`方法用于导航到新的路由，通常会带有参数以便于数据的传递。使用`this.$router.push`时，你可以像这样：

// 基本用法，无参数
this.$router.push('/your-route');

// 传递参数，例如一个对象或数组
this.$router.push({
  name: 'yourRouteName', // 如果是基于名称的路由
  params: {
    id: 123,           // 如果是动态路由参数
    name: 'John Doe'   // 或者多个参数
  }
});

// 或者直接使用查询字符串（query）
this.$router.push({ path: '/your-route?param1=value1&param2=value2' });

// 也可以使用动态路径和参数
this.$router.push(`/route/:id?`, { id: '123' });

// 当你想在导航完成后触发一个回调函数，可以传递一个异步函数作为最后一个参数
this.$router.push('/your-route', () => {
  console.log('Navigating...');
});