uniapp H5禁止页面回退当前页面
可以通过以下两种方法禁止页面回退:
- 使用history.pushState()方法
在页面加载完成后,使用history.pushState()方法将当前页面的状态添加到浏览器的历史记录中。这样,当用户点击浏览器的后退按钮时,页面不会回退到上一个页面,而是停留在当前页面。
示例代码:
mounted() {
history.pushState(null, null, document.URL);
window.addEventListener('popstate', this.onPopState);
},
methods: {
onPopState(event) {
history.pushState(null, null, document.URL);
}
}
- 使用window.onbeforeunload事件
在页面加载完成后,添加window.onbeforeunload事件,当用户离开页面时,弹出提示框,询问用户是否确定离开页面。如果用户选择取消,页面就不会回退到上一个页面。
示例代码:
mounted() {
window.onbeforeunload = this.onBeforeUnload;
},
methods: {
onBeforeUnload(event) {
event.returnValue = '确定离开当前页面吗?';
}
}
原文地址: https://www.cveoy.top/t/topic/bIPd 著作权归作者所有。请勿转载和采集!