目次
1. 問題の説明:
最近、小さなプログラムの開発では、web-view を使用して H5 ページをネストします.H5 ページは vue シングル ページであり、ルーターは履歴モードを採用しています.
WeChat アプレットの Web ビュー ページは、複数層のジャンプを含む Web サイトであり、アプレットのネイティブの左上隅をクリックすると、
ボタンをクリックすると、一度にアプレットのページに戻ることはできませんが、アプレットに戻る前に H5 のすべての履歴アドレスを返します。
ユーザーエクスペリエンスに不親切
2. 理由:
アプレットの先頭にある戻るボタンは、履歴スタックに従ってレイヤーごとに戻ります
3. 解決策:
解決策 1: H5 プロジェクトでは、this.$router.push の代わりに this.$router.replace を使用します。
説明します。
this.$router.push: 指定した URL にジャンプし、履歴スタックに新しいレコードを追加し、[戻る] をクリックして前のページに戻ります。
this.$router.replace は指定された URL にジャンプし、新しいレコードを履歴に追加せず、履歴スタックの最後のレコードを置き換え、クリックして前のページに戻ります。(A----->B----->C 結果 B は C に置き換えられます A----->C)
解決策 2: history.pushState を介して履歴レコード アイテムを追加し、history.onpopstate が履歴レコード エントリの変更を監視するときにアプレット API を呼び出します: wx.navigateBack
現在のスキーム 2 は現在のニーズに適しておらず、採用されたスキーム 1 が開発されました。
https://developer.mozilla.org/en-US/docs/Web/API/History/pushState4. 注意事項：
現時点では、これらの 2 つの解決策は最善の解決策ではないと思いますが、強制的に問題を解決するだけです.同じ問題が発生した場合は、より良い解決策があればメッセージを残すことができます。