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 控制弹出窗口
Apr 10 Javascript
创建一个复制UBB软件信息的链接或按钮的js代码
Jan 06 Javascript
javascript alert乱码的解决方法
Nov 05 Javascript
随鼠标上下滚动的jquery代码
Dec 05 Javascript
JS非Alert实现网页右下角“未读信息”效果弹窗
Sep 26 Javascript
整理AngularJS框架使用过程当中的一些性能优化要点
Mar 05 Javascript
原生JS控制多个滚动条同步跟随滚动效果
Dec 22 Javascript
JavaScript this绑定过程深入详解
Dec 07 Javascript
详解vue更改头像功能实现
Apr 28 Javascript
Layui点击图片弹框预览的实现方法
Sep 16 Javascript
微信小程序3D轮播实现代码
Sep 19 Javascript
element表格翻页第2页从1开始编号(后端从0开始分页)
Dec 10 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 $_FILES函数详解
2011/03/09 PHP
php自动给文章加关键词链接的函数代码
2012/11/29 PHP
PHP和.net中des加解密的实现方法
2013/02/27 PHP
PHP网站建设的流程与步骤分享
2015/09/25 PHP
PHP基于IMAP收取邮件的方法示例
2017/08/07 PHP
JavaScript下申明对象的几种方法小结
2008/10/02 Javascript
Javascript 原型和继承(Prototypes and Inheritance)
2009/04/01 Javascript
Javascript中定义方法的另类写法(批量定义js对象的方法)
2011/02/25 Javascript
javascript中parseInt()函数的定义和用法分析
2014/12/20 Javascript
js模仿php中strtotime()与date()函数实现方法
2015/08/11 Javascript
学习JavaScript设计模式(继承)
2015/11/26 Javascript
js倒计时抢购实例
2015/12/20 Javascript
JS判断字符串变量是否含有某个字串的实现方法
2016/06/03 Javascript
详细谈谈javascript的对象
2016/07/31 Javascript
微信小程序 在线支付功能的实现
2017/03/14 Javascript
node.js实现为PDF添加水印的示例代码
2018/12/05 Javascript
JavaScript实现邮箱后缀提示功能的示例代码
2018/12/13 Javascript
[02:21]十步杀一人,千里不留行——DOTA2全新英雄天涯墨客展示
2018/08/29 DOTA
python从入门到精通(DAY 2)
2015/12/20 Python
Python实现选择排序
2017/06/04 Python
解决seaborn在pycharm中绘图不出图的问题
2018/05/24 Python
详解利用django中间件django.middleware.csrf.CsrfViewMiddleware防止csrf攻击
2018/10/09 Python
解决Django生产环境无法加载静态文件问题的解决
2019/04/23 Python
PySide2出现“ImportError: DLL load failed: 找不到指定的模块”的问题及解决方法
2020/06/10 Python
matplotlib subplot绘制多个子图的方法示例
2020/07/28 Python
python 实现汉诺塔游戏
2020/11/28 Python
Sarenza德国:法国最大的时尚鞋和包包网上商店
2019/06/08 全球购物
什么是Assembly(程序集)
2014/09/14 面试题
市场营销职业生涯规划书范文
2014/01/12 职场文书
银行简历自我评价
2014/02/11 职场文书
进口业务员岗位职责
2014/04/06 职场文书
环保宣传标语
2014/06/12 职场文书
禁毒宣传活动总结
2014/08/26 职场文书
唐山大地震的观后感
2015/06/05 职场文书
《妈妈别哭,有我在》读后感3篇
2020/01/13 职场文书
学会用Python实现滑雪小游戏,再也不用去北海道啦
2021/05/20 Python