vuejs中監(jiān)聽窗口關閉和窗口刷新事件的方法
更新時間：2018年09月21日 15:47:48 作者：Tayshin
今天小編就為大家分享一篇vuejs中監(jiān)聽窗口關閉和窗口刷新事件的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
1、使用window.onunload之類的API
window.onbeforeunload = function (e) {
e = e || window.event;
// 兼容IE8和Firefox 4之前的版本
if (e) {
e.returnValue = '關閉提示';
}
// Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+
return '關閉提示';
};
2、在生命周期鉤子中注冊監(jiān)聽事件
methods: {
beforeunloadHandler (e) {
// ...
}
}
在 mounted 鉤子中注冊事件
mounted() {
window.addEventListener('beforeunload', e => this.beforeunloadHandler(e))
}
在 destroyed 鉤子卸載事件
destroyed() {
window.removeEventListener('beforeunload', e => this.beforeunloadHandler(e))
}
以上這篇vuejs中監(jiān)聽窗口關閉和窗口刷新事件的方法就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
本文主要介紹了vue父子組件之間的傳參的幾種方式小結，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2023-04-04
Vue+better-scroll 實現(xiàn)通訊錄字母索引的示例代碼
通訊錄字母索引是常用的一種功能，本文主要介紹了Vue+better-scroll 實現(xiàn)通訊錄字母索引，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2022-06-06
Vuex是一個專門為Vue.js應用程序開發(fā)的狀態(tài)管理模式，這篇文章主要介紹了Vuex的基本概念、項目搭建以及入坑點，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-11-11
詳解vue中父子組件傳遞參數(shù)props的實現(xiàn)方式
這篇文章主要給大家介紹了在vue中，父子組件傳遞參數(shù)?props?實現(xiàn)方式，文章通過代碼示例介紹的非常詳細，對我們的學習或工作有一定的參考價值,需要的朋友可以參考下2023-07-07
學習過?vue2?的寶子們肯定知道，組件傳值是?vue?項目開發(fā)過程中必不可少的功能場景，在?vue2?里面有很多傳值的方式。今天就來和大家講講Vue3的組件傳值方式，需要的可以參考一下2022-07-07
這篇文章主要介紹了vue2.0頁面前進刷新回退不刷新的實現(xiàn)方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-07-07
vue3中element-plus?Upload上傳文件代碼示例
這篇文章主要介紹了vue3中element-plus?Upload上傳文件的相關資料,在時間開發(fā)中上傳文件是經常遇到的一個需求,文中通過代碼介紹的非常詳細,需要的朋友可以參考下2023-08-08
Vue.js 的模板是基于 DOM 實現(xiàn)的。這意味著所有的 Vue.js 模板都是可解析的有效的 HTML，且通過一些特殊的特性做了增強。Vue 模板因而從根本上不同于基于字符串的模板，請記住這點。2016-09-09
本文通過實例給大家介紹了Vue中使用webpack別名的方法,非常不錯，具體一定的參考借鑒價值，需要的朋友可以參考下2018-06-06
在Vue中使用xlsx組件實現(xiàn)Excel導出功能的步驟詳解
在現(xiàn)代Web應用程序中,數(shù)據(jù)導出到Excel格式是一項常見的需求,Vue.js是一種流行的JavaScript框架,允許我們構建動態(tài)的前端應用程序,本文將介紹如何使用Vue.js和xlsx組件輕松實現(xiàn)Excel數(shù)據(jù)導出功能,需要的朋友可以參考下2023-10-10