Vue プロジェクトではページ内の内部ジャンプであれば this.$router.repalce() で実現できますが、同様の方法で外部リンクにジャンプする場合は http://localhost を追加します。外部リンクの前: 8080/#/ はジャンプで問題を引き起こすので、どうすれば外部リンクにジャンプできるでしょうか? ジャンプリンクは元のウィンドウと外部リンクを開くための新規ウィンドウに分かれており、具体的には以下のとおりです。
HTML部分:
<div class="fottorRightTextOne" @click="jump">Vue ジャンプの外部リンク</div>
以下はJs部分です
1. まず、外部リンクを元のウィンドウで開く方法を説明します。ジャンプ後に元のページに戻りたい場合は、この方法を使用します。次に、それを実現するために次の 2 つの方法を使用します。
(1) location.href = ""を使用して独自のウィンドウジャンプを実現
ジャンプ() {
location.href="https://www.baidu.com/"
}
(2) window.open(url,'_self') を使用します。_self 属性は、ターゲット Web ページが現在のウィンドウに表示されていることを示します
ジャンプ() {
window.open('https://www.baidu.com/', '_self')
}
2. 外部リンクを新しいウィンドウで開きたい場合は、window.open(url,'_blank') を使用できます。_blank 属性は、ターゲット Web ページを新しいウィンドウで表示することを意味します。
ジャンプ() {
window.open('https://www.baidu.com/', '_blank')
}
要約する
window.open<a>本質的には、ラベルのバージョンjs、またはウィンドウを開くためのコーディングとみなすことができますが<a>、ラベルよりも柔軟で、js開いたページとのコミュニケーションを実現できます。