router-link动态传参

router-link动态传参有两种方式：params和query。使用params传参时，在router-link中使用冒号(:)表示需要传递的参数，然后在路由跳转后，通过this.$route.params来获取传递的参数值。例如：`<router-link :to="'/user/' + userName + '/' + userAge">跳转</router-link>`，然后通过this.$route.params.userName和this.$route.params.userAge来获取参数值。使用query传参时，在router-link中使用query对象来设置需要传递的参数，然后在路由跳转后，通过this.$route.query来获取传递的参数值。例如：`<router-link :to="{path: '/profile', query: {name: myName, age: myAge}}">跳转</router-link>`，然后通过this.$route.query.name和this.$route.query.age来获取参数值。

相关问题

router-link跳转传参

要在 Vue.js 中使用 router-link 进行跳转并传递参数，你可以通过在 to 属性中指定目标路由路径，并在该路径后面添加 query 参数或者 params 参数来传递数据。

如果你想要传递 query 参数，可以这样做：

<router-link :to="{ path: '/target', query: { id: 1, name: 'example' } }">跳转到目标</router-link>

在目标路由中，你可以通过 this.$route.query 来获取传递的参数：

this.$route.query.id  // 获取 id 参数
this.$route.query.name  // 获取 name 参数

如果你想要传递 params 参数，可以这样做：

<router-link :to="{ path: `/target/${id}` }">跳转到目标</router-link>

在目标路由中，你可以通过 this.$route.params 来获取传递的参数：

this.$route.params.id  // 获取 id 参数

记得在使用 params 参数进行跳转时，需要在定义路由规则时配置动态参数，例如：

{
  path: '/target/:id',
  component: TargetComponent
}

希望能帮到你！如果你还有其他问题，请继续提问。

router-link 如何传参

在 Vue.js 中，使用 `router-link` 传递参数可以使用 `to` 属性。例如：

<router-link :to="{ name: 'user', params: { userId: 123 }}">User Profile</router-link>

上面的代码中，我们使用了 `name` 属性来指定要跳转的路由，并在 `params` 中传递了一个名为 `userId` 的参数，参数值为 `123`。

在目标路由组件中，我们可以通过 `$route.params` 来获取传递的参数值。例如：

export default {
  name: 'UserProfile',
  mounted() {
    console.log(this.$route.params.userId);
  }
}

上面的代码中，我们使用 `$route.params` 来获取传递的参数值，并在 `mounted` 钩子函数中输出到控制台中。