码迷,mamicode.com
首页 > 其他好文 > 详细

vue的路由跳转及传参(编程式导航)

时间:2019-07-31 15:23:55      阅读:106      评论:0      收藏:0      [点我收藏+]

标签:tag   ring   play   code   path   attribute   att   params   bsp   

1)直接在路由中传参

   this.$router.push({ path: `/childPage/${id}`, })

    需要对应路由配置如下:

 
   {
     path: ‘/childPage/:id‘,
     name: childPage‘,
     component: childPage
   }

获取参数:this.$route.parames.id

2) 通过路由属性中的name来确定匹配的路由,通过params来传递参数

   this.$router.push({ name: childPage‘, params: { id: id } })

    需要对应路由配置如下:

    {

      path: ‘/childPage‘,

      name: childPage‘,

      component: childPage

     }

3) 使用path来匹配路由,然后通过query来传递参数

    this.$router.push({ path: ‘/childPage‘, query: { id: id } })

     需要对应路由配置如下:

       {

         path: ‘/childPage‘,

         name: childPage‘,

         component: childPage

       }

  获取参数:this.$route.query.id

 

 

 

参考:https://segmentfault.com/a/1190000012393587?utm_source=tag-newest?

vue的路由跳转及传参(编程式导航)

标签:tag   ring   play   code   path   attribute   att   params   bsp   

原文地址:https://www.cnblogs.com/mtxg/p/11275896.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!