方法一:
推荐
主要适用于有弹窗或者遮罩的情况下,例如使用dialog,(v-model=“dialog”)当dialog = true 时,弹窗打开。
watch: {
//监测变化
dialog(val) {
if (this.dialog == true) {
//添加一个历史记录
history.pushState(null, null, window.location.href);
}
}
},
mounted() {
//添加一个历史记录
history.pushState(null, null, window.location.href);
// 给window添加一个popstate事件,拦截返回键,执行this.exit_dialog事件,addEventListener需要指向一个方法
window.addEventListener('popstate', this.exit_dialog);
},
methods: {
exit_dialog() {
//关闭弹窗
this.dialog = false;
}
},
destroyed() {
//销毁该事件,重要!
window.removeEventListener("popstate", this.exit_dialog);
},
方法二:
该方法阻止后退的所有动作,不推荐。
mounted() {
//阻止后退的所有动作,包括 键盘、鼠标手势等产生的后退动作。
history.pushState(null, null, window.location.href);
window.addEventListener('popstate', function () {
history.pushState(null, null, window.location.href);
});
},