传参是this.$router ,接收参数是this.$route

$router : 是路由操作对象，只写对象

$route : 路由信息对象，只读对象

query

可使用命名或path的路由

地址栏可见，请求类似 localhost:4396/user?id=3

在目标页面使用this.$route.query.id来获取

例：

router.push({

  name: 'user', 

  query: { 

    id: 123

  }

})

或

router.push({

  path: '/user', 

  query: { 

    id: 123 

  }

})

params

只能使用命名的路由

地址栏不可见，请求类似 localhost:1234/user

在目标页面使用this.$route.params.id来获取

例：

router.push({

  name: 'user', 

  params: { 

    id: 123 

  }

})

注意：使用params传值的话，目标页面刷新后就会丢失params的值。如果要保留的话，可在router.js中配置目标页面的path

例：

{

        path: 'user/:id',

        name: 'user',

        meta: {

          title: '参数'

        },

        component: () => import('@/views/user.vue'),

}