vue动态路由传参的方法

1.params传参（es6模板字符串拼接方式）

this.$router.push({
    path:`/home/${id}`,
})

路由配置
//路由要配置/:id
{
    path:"/home/:id",
    name:"Home",
    component:Home
}
在组件中获取参数
this.$route.params.id

2.通过name来匹配路由，通过param来传参

this.$router.push({
    name:'Home',
    params:{
        id:id
    }
})
路由配置
params用name传递参数，不使用/：id
{
    path:'/home',
    name:Home,
    component:Home
}
组件中获取参数
this.$route.params.id

3.path+query;query传递的参数会通过 /home？id = 66&name =jack展示

this.$router.push({
    path:'/home',
    query:{
        id:id，
        name：jack
    }
})
路由配置
{
    path:'/home',
    name:Home,
    component:Home
}
组件中获取参数
this.$route.query.id