Vueのページジャンプ、パラメータの運び、パラメータ取得関連メソッドまとめ

vue フレームワークを使用してプロジェクトを開発する場合、ページ ジャンプやパラメータの持ち運びが避けられないので、プロジェクトで遭遇する日常的なニーズと解決策をいくつかまとめてみましょう。
パラメータは接続を通じて渡され、パラメータのリンクが表示されます。

this.$router.push({name: 'b页面'，query:{userId: 123}})   //跳转到b页面，携带参数useId.

ここのパラメータはリンク内で確認でき、リンク パラメータ名をインターセプトすることでパラメータを取得できます。具体的な関数は次のとおりです。

export function getParameterByName(name) {
  name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
  const regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
  const results = regex.exec(location.href);
  return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
}

ページではこの関数を直接 getParameterByName('userId') として紹介していますが、これで問題ありません。
パラメータを運ぶ別のメソッドがあり、ページのセキュリティを確保するためにリンクは非表示になります。

this.$router.push({name: 'b页面'，params:{userId: 123}}) // 跳转b页面，参数链接不可见

この方法で渡されたパラメータを取得するのは簡単です。b ページで変数を定義するだけで済みます。

let id = this.$router.params.userId;

対応するパラメータを取得します。
もちろん、次のようなジャンプもあります。

<router-link :to="{name:b页面，params:{userId: 123}}">跳转b页面</router-link>

パラメータ値を取得するには、変数を定義するだけで済みます。