vue 路由传值

Vue路由传值可以通过$route对象或者props属性来实现。

1. 通过$route对象传值

$route对象是Vue Router提供的一个全局变量，可以在路由跳转时获取路由信息。可以通过$route.params来获取动态路由参数，例如：

// 路由配置
{
  path: '/user/:id',
  component: User
}

// 传递参数
<router-link :to="{ path: '/user/123' }">User</router-link>

// 在 User 组件中获取参数
this.$route.params.id // 123

2. 通过props属性传值

除了$route对象传值，还可以通过props属性传递参数。需要在路由配置中添加props属性，并将其设置为true，例如：

// 路由配置
{
  path: '/user',
  component: User,
  props: true
}

// 传递参数
<router-link :to="{ path: '/user', params: { id: 123 } }">User</router-link>

// 在 User 组件中获取参数
props: ['id']

这样就可以通过props属性获取到传递的参数。需要注意的是，使用props传递参数时，参数只能是静态的，不能使用动态路由参数。