vue.jsでページにジャンプする方法

vue.js でページをジャンプする方法: 1. DOM 内の任意のページに戻る、進む、およびジャンプするための 3 つのボタンを設定します; 2. コンストラクター内の任意のページに戻る、進む、およびジャンプを操作します。 1 ページに 3 つのボタンがあり、メソッドをメソッドに記述するだけです。

#この記事の動作環境: Windows10 システム、vue.js 2.5.2、thinkpad t480 コンピューター。

通常の状況では、vue でページ ジャンプを行うときに タグを使用することを選択しますが、コンストラクターで DOM 要素を直接操作することはできないため、この場合はジャンプ方法ページへ?

実装を見てみましょう!

ステップ 1:

まず、DOM に「戻る」、「進む」、「任意のページにジャンプ」という 3 つのボタンを設定します。

<button @click="goback">后退</button>
<button @click="forwards">前进</button>
<button @click="goto">跳转任一页</button>

次のステップはコンストラクターでそれらを操作することです

「戻る」ボタンが選択されると、ページは前のページにジャンプします

「進む」ボタンが選択されると、ページは前のページにジャンプします。 「」ボタンを選択すると、次のページにジャンプします。

「任意のページにジャンプ」ボタンを選択すると、任意のページにジャンプします。

最後のジャンプを除く、任意のページにジャンプします。任意のページ さらに、他の 2 つのボタンには、ジャンプする前に履歴トレースが必要です。

メソッドは、当然ながらメソッド内に記述する必要があります:

methods: {
     goback() {
       this.$router.go(-1)
     },
     forwards() {
       this.$router.go(1)
     },
     goto() {
       this.$router.push("/about")
     }
}

推奨学習:

php トレーニング

以上がvue.jsでページにジャンプする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。