快捷導(dǎo)航

Vue退出登錄時(shí)清空緩存的實(shí)現(xiàn)

更新時(shí)間：2019年11月12日 10:09:13 作者：肖雅峰-Amos

今天小編就為大家分享一篇Vue退出登錄時(shí)清空緩存的實(shí)現(xiàn)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧

如下所示：

 
<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)閉瀏覽器窗口的時(shí)候清空瀏覽器緩存在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%;
}

如果是多頁(yè)面的程序的話，在每一個(gè)頁(yè)面同理只要在mounted方法中，注冊(cè)這個(gè)事件即可！

以上這篇Vue退出登錄時(shí)清空緩存的實(shí)現(xiàn)就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

解決vue打包項(xiàng)目后刷新404的問(wèn)題
下面小編就為大家整理了一篇解決vue打包項(xiàng)目后刷新404的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2018-03-03
vue實(shí)現(xiàn)動(dòng)態(tài)路由詳細(xì)
我們開發(fā)后臺(tái)管理系統(tǒng)過(guò)程中，會(huì)由不同的人操作系統(tǒng)，有admin（管理員）、superAdmin(超管)，及各種運(yùn)營(yíng)、財(cái)務(wù)人員。為了區(qū)別這些人員，會(huì)給不同的人分配不一樣的角色來(lái)展示不同的菜單，這就必須要通過(guò)動(dòng)態(tài)路由來(lái)實(shí)現(xiàn)。下面就來(lái)介紹vue實(shí)現(xiàn)動(dòng)態(tài)路由,需要的朋友可參考一下
2021-10-10
Vue 實(shí)現(xiàn)前進(jìn)刷新后退不刷新的效果
這篇文章主要介紹了Vue 實(shí)現(xiàn)前進(jìn)刷新后退不刷新的效果,小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2019-06-06
WebSocket使用以及在vue如何使用問(wèn)題
這篇文章主要介紹了WebSocket使用以及在vue如何使用問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-05-05
淺談vuex actions和mutation的異曲同工
這篇文章主要介紹了淺談vuex actions和mutation的異曲同工，詳細(xì)的介紹了actions和mutation的使用和區(qū)別，非常具有實(shí)用價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2018-12-12
vue3.0 CLI - 2.6 - 組件的復(fù)用入門教程
這篇文章主要介紹了 vue3.0 CLI - 2.6 - 組件的復(fù)用，非常不錯(cuò)，具有一定的參考借鑒價(jià)值 ,需要的朋友可以參考下
2018-09-09
vue如何監(jiān)聽對(duì)象或者數(shù)組某個(gè)屬性的變化詳解
這篇文章主要給大家介紹了關(guān)于vue如何監(jiān)聽對(duì)象或者數(shù)組某個(gè)屬性的變化,在Vue.js中可以通過(guò)watch監(jiān)聽屬性變化并動(dòng)態(tài)修改其他屬性的值,watch通過(guò)監(jiān)聽器函數(shù)接收新舊值,實(shí)現(xiàn)屬性間的數(shù)據(jù)聯(lián)動(dòng),需要的朋友可以參考下
2024-12-12
vue 實(shí)現(xiàn)Web端的定位功能獲取經(jīng)緯度
這篇文章主要介紹了vue 實(shí)現(xiàn)Web端的定位功能獲取經(jīng)緯度，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2019-08-08
關(guān)于Vue的 watch、computed和methods的區(qū)別匯總
這篇文章主要介紹關(guān)于Vue的 watch、computed和methods的區(qū)別，下面文章將圍繞Vue的 watch、computed和methods的續(xù)航管資料展開全文它們之間區(qū)別的內(nèi)容,需要的朋友可以參考一下，希望能幫助到大家
2021-11-11
總結(jié)Vue Element UI使用中遇到的問(wèn)題
這篇文章主要介紹了Vue Element UI使用中遇到的問(wèn)題，對(duì)ElementUI感興趣的同學(xué)，可以參考下
2021-05-05