vue 移動端禁止瀏覽器后退，禁止安卓和ios點擊后退操作亂跳頁面
開發微信公眾號網頁，頁面登錄成功之后，是禁止再次返回到登錄頁。
我在頁面設置了讓禁止跳到登錄頁，可是在手機上有自帶的微信瀏覽器后退按鈕，所以必須要禁止瀏覽器后退，才能禁止后退到登錄頁。
剛開始百度，查到了一個vue禁止瀏覽器后退的插件：vue-prevent-browser-back
首先，npm i vue-prevent-browser-back -save
然后在需要禁止瀏覽器后退的頁面里引入：
1 Vue.component(Navbar.name, Navbar); 2 Vue.component(TabItem.name, TabItem); 3 import preventBack from 'vue-prevent-browser-back';//組件內單獨引入 4 export default { 5 name: "main", 6 mixins: [preventBack],//注入 7 data() { 8 return { 9 userId:394, 10 selected:'1', 11 ReSelect:'' 12 }; 13 },
這個插件是可以禁止瀏覽器后退，但是它有個問題：就是它把你頁面里添加的后退操作也給禁止了。這是肯定不行了。
所以這個插件只適用于單頁面沒有路由返回跳轉的頁面。
然后我就用了下面的代碼，解決了僅僅是禁止瀏覽器后退，頁面內部的返回無影響。在想要禁止瀏覽器后退的頁面加上下面這段代碼：
1 mounted(){ 2 //防止頁面后退 3 history.pushState(null, null, document.URL); 4 window.addEventListener('popstate', function () { 5 history.pushState(null, null, document.URL); 6 }); 7 this.getProductBrand(0,'',0); 8 9 }
浙公網安備 33010602011771號