第一種：props
配置：
組件內定義：
props: ['id']
路由映射配置，開啟props:true :
{ path: '/user/:id', component: User, props: true }
跳轉傳參：
1、標簽跳轉
<router-link to="/user/1">第一個</router-link>
2.函數式跳轉：
getDescribe(id) {
// 直接調用$router.push 實現攜帶參數的跳轉
this.$router.push({
path: `/describe/${id}`,
})
獲取參數：
<div>第一種傳值props： {{ id }}</div>
第二種：
配置:（url顯示在問號之前）
路由映射配置：
{ path: '/user/:id', component: User },
跳轉傳參：
1、標簽跳轉
<router-link to="/user/1">第二個</router-link>
2.函數式跳轉：
getDescribe(id) {
// 直接調用$router.push 實現攜帶參數的跳轉
this.$router.push({
path: `/user/${id}`,
})
獲取參數：
<div>第二種傳值$route.params.id： {{$route.params.id}}</div>
第三種：（url不顯示參數）
配置：
路由映射配置：
{ path: '/user', component: User },
跳轉傳參：
1、標簽跳轉
<router-link :to="{name:'c', params:{id:1}}">第四個</router-link>
2.函數式跳轉：
getDescribe(id) { // 直接調用$router.push 實現攜帶參數的跳轉 this.$router.push({ path: `/user`, params:{ id:id } })
獲取參數：
<div>第三種傳值$route.params.id： {{$route.params.id}}</div>
第四種：(url顯示在？之后)
配置：
路由映射配置：
{
path: '/user', component: User },
跳轉傳參：
1、標簽跳轉
<router-link :to="{name:'c', query:{id:1}}">第四個</router-link>
2.函數式跳轉：
getDescribe(id) {
// 直接調用$router.push 實現攜帶參數的跳轉
this.$router.push({
path: `/user`,
query:{
id:id
}
})
獲取參數：
<div>第四種傳值$route.query.id： {{$route.query.id}}</div>