1.ルーターを使用する

1. 最初のフロントエンドページは 2 番目のフロントエンドページにジャンプします。最初のフロントエンドページにメソッドを追加できます。

    jumpPage2 (index) {
      this.$router.push({
        path: "/page2",
        query: {
          id: '1',
          name: '测试',
        }
      });
    },

2. 次に、router/index.js以下を追加します。

  {
    path: '/page2',
    name: 'page2Name',
    component: () => import('../views/page2.vue'),
    meta: {
      title: 'page2名称'
    }
  },

3. 次に、jump メソッドがトリガーされると、次のようなパラメーターを受け取ることができる page2.vue ページにジャンプできます。

  created(){
    console.log("第二个页面")
    console.log("id",this.$route.query.id)
    console.log("name",this.$route.query.name)
}

2、URLを使用する

1. 最初に2ページ目のURLを書きます（これは自分で作成したgetDataUrl.jsに書きます）

//启动时用local就会用localhost，用test就会用测试网址，用prod就会用生产网址
//这个ENV可以启动或打包时设置，具体设置方法此处不再赘述
const hosts = ENV === 'local' ? location.origin : ENV === 'test' ? 'https://xxx.test.com' : 'https://xxx.prod.com'

// 第二个页面的前端地址
export const secondUrl = `${hosts}/static/outerTpx/project/#/page2`

について${hosts}/static/outerTpx/project、これは、この URL がフロントエンドプロジェクトにアクセスできるように nginx でルートを構成することです。

        #前端页面地址
        location /static/ {
            alias /home/myuser/nginx/html/;
        }
        
（备注：前端项目在`/home/myuser/nginx/html/outerTpx/project`文件夹里，可以通过`https://xxx.test.com/static/outerTpx/project/index.html?t=123785613241`访问到其中的`/home/myuser/nginx/html/outerTpx/project/index.html`首页）

については/#/page2、設定済みのページrouter/index.jsにジャンプできます。page2.vue(最初のステップを参照)

2. 最初のページでは、次のようにこの URL を使用します。

//从自己新建的js中引入export的参数
import { secondUrl } from '@/http/getDataUrl.js'



//这个得到的是
//https://xxx.test.com/static/outerTpx/project/#/page2?id=1&name=abc
let jumpUrl = secondUrl +"?id=1&name=abc"

//然后跳转即可
window.location.href=jumpUrl

3. 2 番目のページでは、最初のステップと同じように、次のようなパラメータを受け取ることができます。

  created(){
    console.log("第二个页面")
    console.log("id",this.$route.query.id)
    console.log("name",this.$route.query.name)
}

3. 個人的な概要

1.ルーターまたはURLを使用してフロントエンドページ間をジャンプし、渡されたパラメータを受け取ることができますthis.$route.query（私が遭遇したシーンはQRコードをスキャンしてフロントエンドページにジャンプすることでしたので、URLの方法を使用しました）ジャンプすることができ、パラメータも渡すことができます)

2.中国語パラメータを渡すと、それらを使用しencodeURIComponentてdecodeURIComponent処理できます

Vue ページがジャンプしてパラメータを渡す個人的な概要

1.ルーターを使用する

2、URLを使用する

3. 個人的な概要

おすすめ