Vue中怎么判断窗口状态并且在窗口关闭前发送请求?-创新互联

这篇文章为大家详细介绍了Vue中判断窗口状态并且在窗口关闭前发送请求的方法,文中示例代码介绍的非常详细,感兴趣的小伙伴们可以参考一下。

创新互联公司专注于中江网站建设服务及定制,我们拥有丰富的企业做网站经验。 热诚为您提供中江营销型网站建设,中江网站制作、中江网页设计、中江网站官网定制、重庆小程序开发服务,打造中江网络公司原创品牌,更为您提供中江网站排名全网营销落地服务。

代码如下:

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))
   },
   methods: {
    beforeunloadHandler(){
     this._beforeUnload_time=new Date().getTime();
    },
    unloadHandler(e){
     this._gap_time=new Date().getTime()-this._beforeUnload_time;
     debugger
     //判断是窗口关闭还是刷新
     if(this._gap_time<=5){
      //如果是登录状态,关闭窗口前,移除用户
      if(!this.showLoginButton){
       $.ajax({
        url: '/pictureweb/user/remove',
        type: 'get',
        async:false, //或false,是否异步

       })
      }
     }
    },
}

window.beforeunload事件在window.unload事件之前执行。同时注意ajax请求方式必须为同步请求,所以不能使用axios,因为axios不能执行同步请求。

以上就是Vue中判断窗口状态并且在窗口关闭前发送请求的方法介绍,详细使用情况还得要大家自己使用过才能知道具体要领。如果想阅读更多相关内容的文章,欢迎关注创新互联行业资讯频道!

另外有需要云服务器可以了解下创新互联cdcxhl.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


网页题目:Vue中怎么判断窗口状态并且在窗口关闭前发送请求?-创新互联
分享路径:http://scyanting.com/article/dsoocg.html