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 相关文章推荐
jscript之Open an Excel Spreadsheet
Jun 13 Javascript
30个最好的jQuery 灯箱插件分享
Apr 25 Javascript
JavaScript常用全局属性与方法记录积累
Jul 03 Javascript
jquery实现红色竖向多级向右展开的导航菜单效果
Aug 31 Javascript
jQuery插件之Tocify动态节点目录菜单生成器附源码下载
Jan 08 Javascript
详解JavaScript中的自定义事件编写
May 10 Javascript
jquery操作select取值赋值与设置选中实例
Feb 28 Javascript
JS实现移动端按首字母检索城市列表附源码下载
Jul 05 Javascript
vue与原生app的对接交互的方法(混合开发)
Nov 28 Javascript
小程序登录/注册页面设计的实现代码
May 24 Javascript
JS数组中对象去重操作示例
Jun 04 Javascript
微信小程序用户授权最佳实践指南
May 08 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下一个阿拉伯数字转中文数字的函数
2007/07/16 PHP
PHP在不同页面间传递Json数据示例代码
2013/06/08 PHP
PHP图片处理之图片旋转和图片翻转实例
2014/11/19 PHP
php动态生成版权所有信息的方法
2015/03/24 PHP
PHP实现递归复制整个文件夹的类实例
2015/08/03 PHP
PHP jQuery+Ajax结合写批量删除功能
2017/05/19 PHP
WEB页子窗口(showModalDialog和showModelessDialog)使用说明
2009/10/25 Javascript
基于jquery的分页控件(C#)
2011/01/06 Javascript
jQuery ready函数滥用分析
2011/02/16 Javascript
cookie的复制与使用记住用户名实现代码
2013/11/04 Javascript
jquery 操作iframe的几种方法总结
2013/12/13 Javascript
javascript的解析执行顺序在各个浏览器中的不同
2014/03/17 Javascript
js中style.display=&quot;&quot;无效的解决方法
2014/10/30 Javascript
使用JavaScript和CSS实现文本隔行换色的方法
2015/11/04 Javascript
jQuery.Callbacks()回调函数队列用法详解
2016/06/14 Javascript
利用Javascript裁剪图片并存储的简单实现
2017/03/13 Javascript
node.js中express-session配置项详解
2017/05/31 Javascript
React应用中使用Bootstrap的方法
2017/08/15 Javascript
微信小程序基于本地缓存实现点赞功能的方法
2017/12/18 Javascript
原生js代码能实现call和bind吗
2019/07/31 Javascript
JS实现使用POST方式发送请求
2019/08/30 Javascript
JavaScript 双向链表操作实例分析【创建、增加、查找、删除等】
2020/04/28 Javascript
JavaScript React如何修改默认端口号方法详解
2020/07/28 Javascript
JavaScript经典案例之简易计算器
2020/08/24 Javascript
[42:22]DOTA2上海特级锦标赛C组小组赛#1 OG VS Archon第一局
2016/02/27 DOTA
Python3实现抓取javascript动态生成的html网页功能示例
2017/08/22 Python
python图像常规操作
2017/11/11 Python
python实现简易云音乐播放器
2018/01/04 Python
python实现转盘效果 python实现轮盘抽奖游戏
2019/01/22 Python
Django基础知识 URL路由系统详解
2019/07/18 Python
Python使用百度api做人脸对比的方法
2019/08/28 Python
python Pexpect模块的使用
2020/12/25 Python
2014年幼儿园植树节活动方案
2014/03/02 职场文书
办公室班子四风问题对照检查材料
2014/10/04 职场文书
公证书
2019/04/17 职场文书
Jupyter notebook 输出部分显示不全的解决方案
2021/04/24 Python