vue 关闭浏览器窗口的时候,清空localStorage的数据示例


Posted in Javascript onNovember 06, 2019

如果是用vue做的单页面程序的时候,将监听的方法放在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(){
      // 关闭浏览器窗口的时候清空浏览器缓存在localStorage的数据
      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 关闭浏览器窗口的时候,清空localStorage的数据示例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript中的连字符详解
Nov 28 Javascript
利用jQuery实现可以编辑的表格
May 26 Javascript
JavaScript中使用指数方法Math.exp()的简介
Jun 15 Javascript
JavaScript基础知识及常用方法总结
Jan 10 Javascript
JavaScript中this的用法实例分析
Dec 19 Javascript
angular+webpack2实战例子
May 23 Javascript
JQuery.dataTables表格插件添加跳转到指定页
Jun 09 jQuery
详解如何去除vue项目中的#——History模式
Oct 13 Javascript
jQuery使用each遍历循环的方法
Sep 19 jQuery
js如何获取图片url的Blob值并预览示例代码
Mar 07 Javascript
实例详解vue中的$root和$parent
Apr 29 Javascript
详解微信小程序-扫一扫 wx.scanCode() 扫码大变身
Apr 30 Javascript
vue项目强制清除页面缓存的例子
Nov 06 #Javascript
关于vue路由缓存清除在main.js中的设置
Nov 06 #Javascript
JS实现随机抽取三人
Nov 06 #Javascript
Node对CommonJS的模块规范
Nov 06 #Javascript
VUE 组件转换为微信小程序组件的方法
Nov 06 #Javascript
vuex存储复杂参数(如对象数组等)刷新数据丢失的解决方法
Nov 05 #Javascript
解决vue.js提交数组时出现数组下标的问题
Nov 05 #Javascript
You might like
PHP中实现中文字符进制转换原理分析
2011/12/06 PHP
PHP解析html类库simple_html_dom的转码bug
2014/05/22 PHP
PHP中子类重载父类的方法【parent::方法名】
2016/05/06 PHP
PHP中in_array的隐式转换的解决方法
2018/03/06 PHP
php的无刷新操作实现方法分析
2020/02/28 PHP
JavaScript 常用函数库详解
2009/10/21 Javascript
js保留两位小数使用toFixed实现
2013/07/29 Javascript
jquery $.fn $.fx是什么意思有什么用
2013/11/04 Javascript
JS实现兼容性好,自动置顶的淘宝悬浮工具栏效果
2015/09/18 Javascript
jquery实现触发时更新下拉列表内容的方法
2015/12/02 Javascript
Node.js中npm常用命令大全
2016/06/09 Javascript
微信小程序 UI与容器组件总结
2017/02/21 Javascript
Angularjs 实现移动端在线测评效果(推荐)
2017/04/05 Javascript
js核心基础之构造函数constructor用法实例分析
2019/05/11 Javascript
vue或react项目生产环境去掉console.log的操作
2020/09/02 Javascript
[39:53]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第一场 11.19
2020/11/19 DOTA
[03:17]DOTA2-DPC中国联赛1月29日Recap集锦
2021/03/11 DOTA
python计数排序和基数排序算法实例
2014/04/25 Python
python批量修改文件名的实现代码
2014/09/01 Python
Python实现登录人人网并抓取新鲜事的方法
2015/05/11 Python
Python解析并读取PDF文件内容的方法
2018/05/08 Python
python十进制和二进制的转换方法(含浮点数)
2018/07/07 Python
python实现猜数字游戏
2020/03/25 Python
python实现KNN分类算法
2019/10/16 Python
Python关于拓扑排序知识点讲解
2021/01/04 Python
浅谈HTML5 defer和async的区别
2016/06/07 HTML / CSS
GNC健安喜美国官网:美国第一营养品牌
2016/07/22 全球购物
入党自我评价优缺点
2014/01/25 职场文书
2014年秋季开学寄语
2014/08/02 职场文书
水利局群众路线专题民主生活会发言材料
2014/09/21 职场文书
2014年专项整治工作总结
2014/11/17 职场文书
班主任2015新年寄语
2014/12/08 职场文书
酒店仓管员岗位职责
2015/04/01 职场文书
2015中学教学工作总结
2015/07/22 职场文书
matplotlib画混淆矩阵与正确率曲线的实例代码
2021/06/01 Python
SpringBoot连接MySQL获取数据写后端接口的操作方法
2021/11/02 MySQL