vue 關(guān)閉瀏覽器窗口的時候,清空localStorage的數(shù)據(jù)示例
如果是用vue做的單頁面程序的時候,將監(jiān)聽的方法放在App.vue是最靈活的
<template>
<div id="main" class="app-main">
<router-view></router-view>
</div>
</template>
<script>
export default {
data () {
return {
theme: this.$store.state.app.themeColor
};
},
mounted () {
},
beforeDestroy () {
},
methods: {
},
mounted(){
// 關(guān)閉瀏覽器窗口的時候清空瀏覽器緩存在localStorage的數(shù)據(jù)
window.onbeforeunload = function (e) {
var storage = window.localStorage;
storage.clear()
}
}
};
</script>
<style>
html,body{
width: 100%;
height: 100%;
background: #f0f0f0;
overflow: hidden;
}
.app-main{
width: 100%;
height: 100%;
}
</style>
二、如果是多頁面的程序的話,在每一個頁面同理只要在mounted方法中,注冊這個事件即可!
以上這篇vue 關(guān)閉瀏覽器窗口的時候,清空localStorage的數(shù)據(jù)示例就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
elementui之封裝下載模板和導(dǎo)入文件組件方式
這篇文章主要介紹了關(guān)于elementui之封裝下載模板和導(dǎo)入文件組件方式,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-12-12
Vue項(xiàng)目線上更新無需強(qiáng)制刷新的幾種實(shí)現(xiàn)方案(無感更新)
在 Vue 項(xiàng)目中,當(dāng)發(fā)布新版本后,用戶可能因?yàn)闉g覽器緩存而繼續(xù)使用舊版本,所以本文給大家介紹了Vue 項(xiàng)目線上更新無需強(qiáng)制刷新的幾種實(shí)現(xiàn)方案,并通過代碼示例講解的非常詳細(xì),需要的朋友可以參考下2025-03-03
Vue結(jié)合leaflet實(shí)現(xiàn)克里金插值
本文主要介紹了Vue結(jié)合leaflet實(shí)現(xiàn)克里金插值,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-06-06
Vue項(xiàng)目中ESLint配置超全指南(VScode)
ESLint是一個代碼檢查工具,用來檢查你的代碼是否符合指定的規(guī)范,下面這篇文章主要給大家介紹了關(guān)于Vue項(xiàng)目中ESLint配置(VScode)的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-04-04
vue quill editor 使用富文本添加上傳音頻功能
vue-quill-editor 是vue項(xiàng)目中常用的富文本插件,其功能能滿足大部分的項(xiàng)目需求。這篇文章主要介紹了vue-quill-editor 富文本添加上傳音頻功能,需要的朋友可以參考下2020-01-01

