首页 > 其他 > 详细

vue 路由传参

时间:2020-04-27 17:43:18      阅读:46      评论:0      收藏:0      [点我收藏+]

 1、 this.$router.push进行编程式路由跳转

    2、 router-link 进行页面按钮式路由跳转

    3、 this.$route.params获取路由传递参数

    4、this.$route.query获取路由传递参数

    5、 params 和 query 都是传递参数的,params不会在url上面出现,并且params参数是路由的一部分,是一定要存在的 query则是我们通常看到的url后面的跟在?后面的显示参数

方法一 

this.$router.push({
            path:"/路径名字",
            query:{
              id:id
            }
          })
方法二
this.$router.push({
             name:"/路径名字",
             params:{
              id:id
            }
          })
方法三
this.$router.push(‘.路径名‘+id)
 
 
路由。index.js文件
 {
      //方式一 二路由路径
      path: ‘/路径名‘,
      //方式三路由路径
      // path: ‘/路径名:id‘,
      name: ‘Xq‘,
      component: Xq
    },
 接受传过来的参数
    方法一接收
  this.$route.query.id
 
 <!--  方法二接收  -->
 this.$route.params.id
 
 <!--  方法三接收  -->
 this.$route.params.id

vue 路由传参

原文:https://www.cnblogs.com/jackie-song/p/12787989.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!