vueは新しいウィンドウを開けて、参考文献の実例を実現します。

私が実現したい機能は新しいウィンドウを開けて新しいページを展示することです。パラメータを伝える必要があります。そして、パラメータはアドレスバーに表示できません。また、私がページを更新する時に、送ってきたパラメータは失われません。この新しいウィンドウ、つまりブラウザのタブページを手動で閉じない限り、ずっと存在しています。
Baidu向けのプログラミングを通じて、ネット上の根本的な効果が得られないことを発見しました。しかも、全部ピットです。実現できないのに、もしそのことがあれば、書きました。だから、タイトルにわざわざ図があります。
まず私が作ったコードを書いて、後で他の人が実現できない穴を紹介します。この点に関して注意してください。
新しいウィンドウを開き、コードを転送します。

//        ，            ，         ，      
handleWindow() {
 //            
 var route = this.$router.resolve({
 name: 'Xterm',
 })
 //           
 sessionStorage.setItem("ip", "1.1.1.1");
 
 window.open(route.href, '_blank')
}

私のルートの配置も貼り付けてください。

{
 path: '/xterm',
 hidden: true,
 component: () => import('@/views/monitor/xterm/index'),
 name: 'Xterm',
},

現在はページ受信パラメータです。

//vue      ，      ，     
created() {
 alert(sessionStorage.getItem("ip"));
 this.ip = sessionStorage.getItem("ip")
},

真相図を貼る

これはvueを通じて新しいウィンドウを開き、session Strageを通してパラメータを取得します。なぜこのようにしかできないのですか？この機能を実現するために、以下に私のステップを説明します。大衆の中に悪い人がいて、偽のコードを持ってネット上で人をだまして、どのコードの農作業がこのような試練に耐えられませんか？
まずこの機能は新しいウィンドウを開く必要があります。
第一種類：<router-link>タグを通して、このようなラベルの書き方は個人的にはあまり気に入らないです。簡単なビジネスシーンについては無理ですが、業務の山のような多くのパラメータを処理したいです。このようなラベルの書き方は業務の開拓に不利です。直接排除、OUT！
第二の方法：router.replaceを通じて、この方法のウィンドウを開けて、現在のAページを過去のBページにジャンプするに置き換えます。新しいウィンドウを開けたら、新しいものを見たいです。これはいいです。直接に前のページがなくなりました。これは卵を使わないですか？私が実験した後、OUT！
第3の方法：router.resolveを通じて、これは新しいウィンドウを開いて、現在のAページに影響しないで、直接ブラウザのタブページを開けて、タブページを往復して切り替えて、2ページの情報データを見にきます。これはニックです。気に入りました。これです。
ちなみに、vue 2.0以降は、日々流行しているHTML 5と一致するように、router.goとrouter.pushは新しいウィンドウの開く属性をサポートしていません。router.goは前進後退として使われています。router.pushは案内特殊ページとして使われています。このジャンプは新しいウィンドウを開けません。history機能があります。もしあなたの窓口に複数のタブがあるなら、これを使って複数のページを開けてもいいです。

はい、router.resoveを使って、私達は新しいウィンドウにジャンプできます。それでは今から参席します。これはピットさんのところに行きます。ネットでの運搬によると、主に次の2種類の参。

//       
testA (aaa) {
 const route = this.$router.resolve({
   name: 'Xterm', 
   params: {
     ip: aaa
   }
 })
 window.open(route.href,'_blank')
}

//       
testA (bbb) {
 const route = this.$router.resolve({
   path: '/xterm', 
   query: {
     ip: bbb
   }
 })
 window.open(route.href,'_blank')
}

対応する受信パラメータを以下に示します。

created() {
 //       
 this.ip = this.$route.params.ip
 //       
 this.ip = this.$route.query.ip
},

テストの結果、第一の種類は永遠に値を取れません。第二のアドレスバーには伝達の各パラメータ値が露出されています。最初にいろいろな特殊処理をしたとしても、一番いい結果は初めて値を取っただけです。もう一度ページを更新したら、値がなくなってしまいます。どうすればいいですか？誰がユーザーがカードを持っているとは思わないと保証してくれます。そして、更新ボタンをクリックしました。このようなrouter.push内での参照は全く問題ないです。全部受信できます。違いはname+paramsの組み合わせです。パラメータはアドレスバーの中にありません。リフレッシュしたらデータは消えます。パス+queryの組み合わせは、アドレスバーの中にパラメータがあります。いくらページを更新しても、値はずっとあります。pushで試した後、当然のようにresoliveも同じだと思います。多くのブログで書いたのを見ていますが、アドレスバーを通して渡参しないで、第一種類の参を使って、成功できないです。まだクリック数が高いです。泣きたいです。
仕方ないです。自分で手を動かして、キャッシュを探してみました。local Strageとsession Strageのプロパティを見つけました。session Strageはデータを一時保存するために使います。ウィンドウやタブページを閉じてからこれらのデータを削除します。local Strageはウェブサイト全体のデータを長く保存するために使用されます。保存されたデータは有効期限が切れるまでは手動で削除されません。明らかに、session Strageでいいです。
この2つの属性をサポートするブラウザのバージョンは以下の通りです。

これで問題は解決されました。実は、複雑ではないです。ネット上の答えは玉石混交で、記録して他の人に使わせます。
締め括りをつける
ここでvueについて新たなウィンドウを開き、これまでの記事を紹介します。vueに関する詳細は新しいウィンドウを開けて内容を伝えます。以前の文章を検索してください。または、下記の関連記事を引き続きご覧ください。これからもよろしくお願いします。