vue query、params传参

a跳转b页面传参
1、query
(1) a.vue:

 this.$router.push({ 
 path: "/b", 
 query: {id:'home', name:'query'} });

(2) b.vue:

console.log(this.$route.query.id)

(3) 路由:

{
path: '/b',
name: 'b',
component: () => import('@/view/b')
}

2、params
(1) a.vue:

 this.$router.push({ 
 name:'b',  //这里注意path和name
 params: {id:'home', name:'params'} });

注：path 会忽略 params 这个属性

const userId = '123'
router.push({ name: 'user', params: { userId }}) // -> /user/123
router.push({ path: `/user/${userId}` }) // -> /user/123
// 这里的 params 不生效
router.push({ path: '/user', params: { userId }}) // -> /user

(2) b.vue:

console.log(this.$route.params.id)

(3) 路由:

{
path: '/b/:id/:name',  //加参数的原因
name: 'b',
component: () => import('@/view/b')
}

注：加参数的原因
地址栏没有参数，页面跳转失败或者页面没有内容

参考：
Vue Router 的params和query传参的使用和区别（详尽）