zoukankan      html  css  js  c++  java
  • 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
Copyright © 2011-2022 走看看