Vue クエリ、params パラメーターの受け渡し

a ジャンプ b ページ パラメータ
1、クエリ
(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、パラメータ
(1) a.vue:

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

注: パスは 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とクエリパラメータの使い方と違い（詳細）