vue3监听网页窗口关闭

最新推荐文章于 2024-05-28 18:49:29 发布

星空与猫

最新推荐文章于 2024-05-28 18:49:29 发布

阅读量6.1k

点赞数 1

分类专栏： vue3 文章标签：前端 vue.js javascript

本文链接：https://blog.csdn.net/qq_43388107/article/details/125927138

版权

vue3 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<!-- 监听窗口关闭 -->
<script setup>
import { onMounted, onUnmounted } from 'vue'

let _beforeUnload_time = '';
let _gap_time = '';


let beforeunloadHandler = (e) => {
    _beforeUnload_time = new Date().getTime();
    //e.returnValue = '关闭提示'; 弹窗
};
let unloadHandler = (e) => {
    _gap_time = new Date().getTime() - _beforeUnload_time;
    //判断是窗口关闭还是刷新
    if (_gap_time <= 5) {
        console.log('xxxxxxxx');
        // 退出登录 
        // xxxxxxxx
        // 通知后台
        // xxxxxxxx
    }
};


onMounted(() => {
    window.addEventListener("beforeunload", (e) => beforeunloadHandler(e));
    window.addEventListener("unload", (e) => unloadHandler(e));

})

onUnmounted(() => {
    window.removeEventListener("beforeunload", (e) => beforeunloadHandler(e));
    window.removeEventListener("unload", (e) => unloadHandler(e));
})

</script>