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学习笔记(十)
Jan 17 Javascript
可以用来调试JavaScript错误的解决方案
Aug 07 Javascript
基于Jquery的$.cookie()实现跨越页面tabs导航实现代码
Mar 03 Javascript
javascript 获取浏览器版本
Jan 21 Javascript
JS模仿编辑器实时改变文本框宽度和高度大小的方法
Aug 17 Javascript
AngularJS directive返回对象属性详解
Mar 28 Javascript
jQuery插件 Jqplot图表实例
Jun 18 Javascript
JS中this上下文对象使用方式
Oct 09 Javascript
最常见和最有用的字符串相关的方法详解
Feb 06 Javascript
详解各版本React路由的跳转的方法
May 10 Javascript
微信小程序实现多选功能
Nov 04 Javascript
微信小程序实现点击生成随机验证码
Sep 09 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的类树(支持无限分类)
2006/10/09 PHP
优化PHP代码的53条建议
2008/03/27 PHP
PHP 判断常量,变量和函数是否存在
2009/04/26 PHP
数据库中排序的对比及使用条件详解
2012/02/23 PHP
php获取用户IPv4或IPv6地址的代码
2012/11/15 PHP
PHP获取不了React Native Fecth参数的解决办法
2016/08/26 PHP
php数组函数array_push()、array_pop()及array_shift()简单用法示例
2020/01/26 PHP
Javascript Tab 导航插件 (23个)
2009/06/11 Javascript
JS实现OCX控件的事件响应示例
2014/09/17 Javascript
jquery动态分页效果堪比时光网
2014/09/25 Javascript
js实现飞入星星特效代码
2014/10/17 Javascript
深入理解jquery自定义动画animate()
2016/05/24 Javascript
js添加千分位的实现代码(超简单)
2016/08/01 Javascript
js获取页面引用的css样式表中的属性值方法(推荐)
2016/08/19 Javascript
vscode中eslint插件的配置(prettier配置无效)
2019/09/10 Javascript
[05:39]2014DOTA2西雅图国际邀请赛 淘汰赛7月14日TOPPLAY
2014/07/14 DOTA
[02:04]2016国际邀请赛中国区预选赛VG.R晋级之路
2016/07/01 DOTA
[03:00]2018完美盛典_最佳英雄奖
2018/12/17 DOTA
pandas通过索引进行排序的示例
2018/11/16 Python
Python3.8对可迭代解包的改进及用法详解
2019/10/15 Python
基于Python检测动态物体颜色过程解析
2019/12/04 Python
Eastbay官网:美国最大的运动鞋网络零售商
2016/07/27 全球购物
狗狗玩具、零食和咀嚼物的月度送货服务:Super Chewer
2018/08/22 全球购物
Surfdome西班牙:世界上最受欢迎的生活方式品牌
2019/02/13 全球购物
DELPHI中如何调用API,可举例说明
2014/01/16 面试题
亲戚结婚的请假条
2014/02/11 职场文书
上课迟到检讨书
2014/02/19 职场文书
幼儿教师寄语集锦
2014/04/03 职场文书
警校毕业生自我评价
2014/04/06 职场文书
献爱心倡议书
2014/04/14 职场文书
2014年学校党建工作总结
2014/11/11 职场文书
先进班集体申报材料
2014/12/26 职场文书
在校生证明
2015/06/17 职场文书
初二数学教学反思
2016/02/17 职场文书
css 中多种边框的实现小窍门
2021/04/07 HTML / CSS
CSS基础详解
2021/10/16 HTML / CSS