vue如何在用戶(hù)要關(guān)閉當(dāng)前網(wǎng)頁(yè)時(shí)彈出提示的實(shí)現(xiàn)
本文介紹了vue如何在用戶(hù)要關(guān)閉當(dāng)前網(wǎng)頁(yè)時(shí)彈出提示的實(shí)現(xiàn)，分享給大家，具體如下：
效果如下圖
正常 js 頁(yè)面處理方式
window.onbeforeunload = function (e) {
e = e || window.event;
// 兼容IE8和Firefox 4之前的版本
if (e) {
e.returnValue = '關(guān)閉提示';
}
// Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+
return '關(guān)閉提示';
};
vue 中處理方式
let _this = this
window.onbeforeunload = function (e) {
if (_this.$route.name == "dyyPerformanceCenterSale") {
e = e || window.event;
// 兼容IE8和Firefox 4之前的版本
if (e) {
e.returnValue = '關(guān)閉提示1111';
}
// Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+
return '關(guān)閉提示222';
} else {
window.onbeforeunload = null
}
};
針對(duì)很多同學(xué)說(shuō)的沒(méi)有實(shí)現(xiàn) ，我這里在詳細(xì)描述一下 方法寫(xiě)在 mounted里面 ，然后 記得把route name替換成自己當(dāng)前頁(yè)面的
到此這篇關(guān)于vue如何在用戶(hù)要關(guān)閉當(dāng)前網(wǎng)頁(yè)時(shí)彈出提示的實(shí)現(xiàn)的文章就介紹到這了,更多相關(guān)vue關(guān)閉當(dāng)前網(wǎng)頁(yè)時(shí)彈出提示內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
VUE el-tree組件左邊勾選，右邊清除交互問(wèn)題
這篇文章主要介紹了VUE el-tree組件左邊勾選，右邊清除交互問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。2023-04-04
解決vue單頁(yè)面多個(gè)組件嵌套監(jiān)聽(tīng)瀏覽器窗口變化問(wèn)題
這篇文章主要介紹了解決vue單頁(yè)面多個(gè)組件嵌套監(jiān)聽(tīng)瀏覽器窗口變化問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-07-07
el-dialog關(guān)閉再打開(kāi)后窗口內(nèi)容不刷新問(wèn)題及解決
這篇文章主要介紹了el-dialog關(guān)閉再打開(kāi)后窗口內(nèi)容不刷新問(wèn)題及解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-02-02
Vue動(dòng)態(tài)組件與異步組件超詳細(xì)講解
這篇文章主要介紹了Vue動(dòng)態(tài)組件與異步組件，動(dòng)態(tài)組件是根據(jù)數(shù)據(jù)的變化，可以隨時(shí)切換不同的組件，比如咱們現(xiàn)在要展示一個(gè)文本框和輸入框，我們想要根據(jù)我們data中定義的值去決定是顯示文本框還是輸入框2023-03-03
vue中改變選中當(dāng)前項(xiàng)的顯示隱藏或者狀態(tài)的實(shí)現(xiàn)方法
下面小編就為大家分享一篇vue中改變選中當(dāng)前項(xiàng)的顯示隱藏或者狀態(tài)的實(shí)現(xiàn)方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-02-02
這篇文章主要介紹了Vuejs第八篇之Vuejs組件的定義實(shí)例解析的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-09-09
Vue實(shí)現(xiàn)購(gòu)物車(chē)詳情頁(yè)面的方法
這篇文章主要介紹了Vue實(shí)戰(zhàn)之購(gòu)物車(chē)詳情頁(yè)面的實(shí)現(xiàn),本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2019-08-08
vue cli3 實(shí)現(xiàn)分環(huán)境打包的步驟
這篇文章主要介紹了vue cli3 實(shí)現(xiàn)分環(huán)境打包的步驟，本文通過(guò)圖文并茂的形式給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-03-03
這篇文章主要為大家詳細(xì)介紹了Vue3中Composition的一些常見(jiàn)API的用法，文中的示例代碼講解詳細(xì)，感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-06-06
利用vueJs實(shí)現(xiàn)圖片輪播實(shí)例代碼
本篇文章主要介紹了利用vueJs實(shí)現(xiàn)圖片輪播實(shí)例代碼，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-06-06