vue路由跳转及传参方式

1. 直接在路由中传参

   传参方式：
           this.$router.push({ path: `/childPage/${id}`, })

   需要对应路由配置如下：
      {
         path: '/childPage/:id',
         name: 'childPage',
         component: childPage
      }

   获取参数：this.$route.params.id

   
   

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

   传参方式：
           this.$router.push({ name: 'childPage', params: { id: id } })

   注意：这里可以添加:/id 也可以不添加，不添加数据会在url后面显示，不添加数据就不会显示

   需要对应路由配置如下：
   　 {
         path: '/childPage',
         name: 'childPage',
         component: childPage
      }
   
   

   获取参数：this.$route.params.id

   
   

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

   传参方式：
           this.$router.push({ path: '/childPage', query: { id: id } })

   需要对应路由配置如下：
       {
           path: '/childPage',
           name: 'childPage',
           component: childPage
       }

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