1、监听浏览器页面关闭/刷新事件。
运用场景：浏览器页面关闭后删除local storage、session、cookie、发送请求等。文章来源：https://www.toymoban.com/news/detail-540031.html
//绑定监听事件
mounted() {
window.addEventListener('beforeunload', e => this.beforeunloadHandler(e))
}
methods: {
beforeunloadHandler(e) {
console.log('关闭后=>为所欲为')
}
},
//页面销毁前解除监听
destroyed() {
window.removeEventListener('beforeunload', e => this.beforeunloadHandler(e))
}2、只监听浏览器关闭事件文章来源地址https://www.toymoban.com/news/detail-540031.html
data(){
return{
beforeUnload: '',
Handler: ''
}
}
mounted() {
window.addEventListener('beforeunload', e => this.beforeunloadHandler(e))
window.addEventListener('unload', e => this.unloadHandler(e))
},
destroyed() {
window.removeEventListener('beforeunload', e => this.beforeunloadHandler(e))
window.removeEventListener('unload', e => this.unloadHandler(e))
},
ethods: {
beforeunloadHandler(){
this.beforeUnload=new Date().getTime();
},
unloadHandler(e){
this.Handler=new Date().getTime()-this.beforeUnload;
//判断是窗口关闭还是刷新
if(this.Handler<=5){
console.log('为所欲为');
}
},
}到了这里，关于vue 监听浏览器网页关闭和网页刷新事件的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
