vue 路由跳转传参

正常跳转

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