记录—Vue监听浏览器刷新或关闭

Vue监听浏览器刷新或关闭

一:使用window对象的onbeforeunload方法

mounted () {
    window.onbeforeunload = function (e) {
        var message = 'some word';
        e = e || window.event;
        if (e) {
            e.returnValue = message;
        }
        return "浏览器关闭!";
    };
}

注意!在旧版浏览器中可以自定义提示文案,既是return后面返回的参数
但在新版的浏览中,已经不支持自定义弹窗。只能调用浏览器自带的提示确认窗格。

image.png

不需要出现弹窗的话,只要return后边不带任何参数即可;

二:使用window.addEventListener

    methods:{
        // 监听浏览器是否关闭
        browerStatus(){
            var that = this;
            console.log("浏览器刷新 || 关闭了");
        }
    },
    mounted () {
        var that = this;
        // 监听浏览器是否关闭
        window.addEventListener( "beforeunload", e => that.browerStatus() );
    },
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 1,394评论 0 2
  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 9,350评论 0 3
  • 以后是对于初学者有帮助的一些JS的方法API,使用即说明 ■JS组成■1,ECMAScript : js的核心标准...
    简爱的三年阅读 855评论 0 0
  • Call 和 Apply 的区别 语法:function.call(thisObj [, arg1[, arg2[...
    他方l阅读 326评论 0 0
  • @转自GitHub 介绍js的基本数据类型。Undefined、Null、Boolean、Number、Strin...
    YT_Zou阅读 1,213评论 0 0