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 相关文章推荐
简略的前端架构心得&amp;&amp;基于editor为例子的编码小技巧
Nov 25 Javascript
dotopAlert 提示用户需安装播放器的代码
Sep 17 Javascript
一个页面元素appendchild追加到另一个页面元素的问题
Jan 27 Javascript
jQuery实现页面内锚点平滑跳转特效的方法总结
May 11 Javascript
JS创建事件的三种方法(实例代码)
May 12 Javascript
关于JavaScript 原型链的一点个人理解
Jul 31 Javascript
Angular-Touch库用法示例
Dec 22 Javascript
详谈for循环里面的break和continue语句
Jul 20 Javascript
JS多个表单数据提交下的serialize()应用实例分析
Aug 27 Javascript
vue实现在线翻译功能
Sep 27 Javascript
vue动态加载SVG文件并修改节点数据的操作代码
Aug 17 Javascript
vue 中的动态传参和query传参操作
Nov 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
CodeIgniter图像处理类的深入解析
2013/06/17 PHP
为你总结一些php信息函数
2015/10/21 PHP
THINKPHP-Apache服务器中使用Alias虚拟目录URL重写 隐藏index.php
2021/03/09 PHP
javascript showModalDialog,open取得父窗口的方法
2010/03/10 Javascript
jquery实现简单的拖拽效果实例兼容所有主流浏览器(优化篇)
2013/06/28 Javascript
javascript 数组排序函数sort和reverse使用介绍
2013/11/21 Javascript
JS关闭窗口与JS关闭页面的几种方法小结
2013/12/17 Javascript
jQuery中toggleClass()方法用法实例
2015/01/05 Javascript
Javascript毫秒数用法实例
2015/02/05 Javascript
Node.js的环境安装配置(使用nvm方式)
2016/10/11 Javascript
three.js中文文档学习之创建场景
2017/11/20 Javascript
基于node下的http小爬虫的示例代码
2018/01/11 Javascript
Node.js net模块功能及事件监听用法分析
2019/01/05 Javascript
微信小程序下拉加载和上拉刷新两种实现方法详解
2019/09/05 Javascript
js实现坦克移动小游戏
2019/10/28 Javascript
Python中字典(dict)和列表(list)的排序方法实例
2014/06/16 Python
使用Python3编写抓取网页和只抓网页图片的脚本
2015/08/20 Python
python中import学习备忘笔记
2017/01/24 Python
深入理解Python单元测试unittest的使用示例
2017/11/18 Python
使用python实现快速搭建简易的FTP服务器
2018/09/12 Python
python去除拼音声调字母,替换为字母的方法
2018/11/28 Python
使用python实现语音文件的特征提取方法
2019/01/09 Python
PyTorch基本数据类型(一)
2019/05/22 Python
python如何读取bin文件并下发串口
2019/07/05 Python
使用python对多个txt文件中的数据进行筛选的方法
2019/07/10 Python
python实现屏保程序(适用于背单词)
2019/07/30 Python
pycharm内无法import已安装的模块问题解决
2020/02/12 Python
全球知名的婚恋交友网站:Match.com
2017/01/05 全球购物
世界领先的艺术图书出版社:TASCHEN
2018/07/23 全球购物
小蚁科技官方商店:YI Technology
2019/08/23 全球购物
安全目标管理责任书
2014/07/25 职场文书
社区党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
教师节校长致辞
2015/07/31 职场文书
幼儿园2016年感恩节活动总结
2016/04/01 职场文书
常用的MongoDB查询语句的示例代码
2021/07/25 MongoDB
python中 .npy文件的读写操作实例
2022/04/14 Python