Vue router-link 两种传参方法及参数的使用
1.路径:http://localhost:8080/#/detail?detail_id=1<router-link :to="{path:'/detail',query: {detail_id: id}}">跳转</router-link> (id是参数值)js中使用获取参数值:this.$route.query.idjs跳转:this.$r...
·
1.路径:http://localhost:8080/#/detail?detail_id=1
<router-link :to="{path:'/detail',query: {detail_id: id}}">跳转</router-link> (id是参数值)
js中使用获取参数值:
this.$route.query.id
js跳转:
this.$router.push({
path:"/detail",
query:{
id:1
}
})
2.路径:http://localhost:8081/#/detail/1
<router-link :to="'/detail/'+id">跳转</router-link> (id是参数值)
路由配置:
{
path:'/detail/:id',
name:'Detail',
component:DetailComponent
}
注意:router-link中链接如果是‘/’开始就是从根路由开始,如果开始不带‘/’,则从当前路由开始
js中使用获取参数值:
this.$route.params.id //这个id是路由的配置id
更多推荐
已为社区贡献26条内容
所有评论(0)