JavaScript - vue シングルページアプリはブラウザーが戻れないようにしますか?

Question

web アプリのシングルページ アプリケーションは vue vue-router で作成されます。

一部のページは戻ることを禁止する必要がある 現在のページが戻ることができるかどうかは、allowBack などのルーティング メタ情報メタに書きました。

バッキングを無効にする情報と方法は
history.pushState(null, null, location.href)

です。

前のプロジェクトでは vue1.0 を使用していました。解決策は次のとおりです。

リーリー

ここで vue2.0 に切り替えます。元の方法はもう機能しません。

今の問題は、history.pushState(null, null, location.href) コードをどこに配置すればよいかわからないことです。
または、他の解決策はありますか?ありがとう！ ！

---

実際、主な使用シナリオは次のとおりです。
タブバーをクリックして別のページに切り替えます。現在ページ a にいて、タブバーをクリックしてページ b に移動すると、ページ a に戻ることはできません。 return キーを押しますが、タブバーをクリックするとページ a

に移動します

Answer 1

質問と回答...
要件は、相互の切り替えに影響を与えずにブラウザを介して特定のルートを返すことはできないということです
解決策と使用法を整理しましょう:

1. ルーティング設定でこのルートに次のようなメタ情報を追加します。 リーリー

2. グローバル router.beforeEach 関数でallowBack ステータスを取得し、同時に vuex のallowBack 値を更新します。以下のようにします。 リーリー

vue1.0とは少し異なり、next()の前に書かれたlocation.hrefはtoのアドレスではないため、このコードはnext()の後に書かなければなりません

3. 次のステップは核心であり、app.vue にマウントされた onpopstate イベントを登録します。 リーリー

history.pushState(null, null, location.href) を削除するとバックオフを防ぐこともできますが、コンポーネントが再レンダリングされるため、この部分も重要です

Answer 2

これを試してみてください

リーリー