vue 動態路由傳參

1. //   直接調用$router.push 實現攜帶參數的跳轉
           this.$router.push({
             path: `/describe/${id}`,
   

   需要對應路由配置如下：

    {
        path: '/describe/:id',
        name: 'Describe',
        component: Describe
      }
   
   //獲取參數方法
   

   this.$route.params.id

    

2. this.$router.push({
             name: 'Describe',
             params: {
               id: id
             }
           })

   路由配置：

   //這里可以添加:/id 也可以不添加，不添加數據會在url后面顯示，不添加數據就不會顯示
     {
        path: '/describe',
        name: 'Describe',
        component: Describe
      }
   
   //獲取參數
   

   this.$route.params.id

    

3. //query傳遞的參數會顯示在url后面?id=？
     this.$router.push({
             path: '/describe',
             query: {
               id: id
             }
           })

   對應路由配置：

    {
        path: '/describe',
        name: 'Describe',
        component: Describe
      }
   
   
   //獲取參數
   

   this.$route.query.id

   注意：
   在子組件中 獲取參數的時候是$route.params 而不是
   $router 這很重要~~~