第一种:单一参数
{
path: '/news/:id', //模板props中也需要是id
props:true,
name:news,
component: news
}
![vue 中路径props的传参-青梅煮码](https://i-blog.csdnimg.cn/blog_migrate/94673c4edf3dd617d4e6cfd0c22cb6f7.png)
![vue 中路径props的传参-青梅煮码](https://i-blog.csdnimg.cn/blog_migrate/846cbf34e634f05dd090d15a34945597.png)
第二种:多个参数
{
path: '/news/:id',
props:function(route){
console.log(route);
return {
id:route.params.id,
username:route.query.username
}
},
name:news,
alias:'/self',//别名
component: news
},
![vue 中路径props的传参-青梅煮码](https://i-blog.csdnimg.cn/blog_migrate/1f19cd68d8b116d5173382b42ce80cf1.png)
![vue 中路径props的传参-青梅煮码](https://i-blog.csdnimg.cn/blog_migrate/89db721428135ae403b55c08be980923.png)