vue 路由跳转传参

最新推荐文章于 2024-04-12 20:56:34 发布

weixin_30781433

最新推荐文章于 2024-04-12 20:56:34 发布

阅读量61

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/xzc666/p/9456244.html

版权

正常跳转

this.$router.push('/index');

1带参

　　toOrderDetail() {
　　  let orderUuid = this.order.uuid;
　　  this.$router.push({path: `/orderDetail/${orderUuid}`});
　　}
　路由配置

　　path: '/orderDetail/:orderUuid',    在path后面加 /:xxxx
　　name: 'orderDetail',　　　　　　　　　　再加个name

　接值

　　this.$route.params.orderUuid // 在orderDetail页里面直接接收

2.params传参
　　this.$router.push({
 　　name: ‘orderDetail, // 这里通过name来引入router

 　　params:{
　　 　　id:this.uuId
　　 }
　　});

　　路由配置
　　　　需要name：‘orderDetail’

　　this.$route.params.id  // 在页面直接接收

3.query把params的name 换成path

　　this.$router.push({
 　　　　path: '/orderDetail',

 　　　　query:{

　　　　 　　id:this.uuId
　　　　 }
　　});


　　this.$route.query.id //这样接收


最后：
　　query要用path来引入，params要用name来引入，接收参数都是类似的，分别是this.$route.query.id和this.$route.params.id。
　　query在地址栏中有显示的
　　params不显示的

转载于:https://www.cnblogs.com/xzc666/p/9456244.html

关注