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 相关文章推荐
vue的props实现子组件随父组件一起变化
Oct 27 Javascript
Bootstrap导航条可点击和鼠标悬停显示下拉菜单
Nov 25 Javascript
jQuery中Datatables增加跳转到指定页功能
Feb 08 Javascript
JS拉起或下载app的实现代码
Feb 22 Javascript
JavaScript中一些特殊的字符运算
Aug 17 Javascript
Auto.js自动收取自己和好友蚂蚁森林能量脚本
Jun 28 Javascript
详解如何使用koa实现socket.io官网的例子
Nov 04 Javascript
vue 实现强制类型转换 数字类型转为字符串
Nov 07 Javascript
公众号SVG动画交互实战代码
May 31 Javascript
详解Node.JS模块 process
Aug 31 Javascript
如何在vue中使用kindeditor富文本编辑器
Dec 19 Vue.js
JavaScript实现滚动加载更多
Dec 27 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面向对象全攻略 (十二) 抽象方法和抽象类
2009/09/30 PHP
PHP用mb_string函数库处理与windows相关中文字符及Win环境下开启PHP Mb_String方法
2015/11/11 PHP
php实现的xml操作类
2016/01/15 PHP
Symfony2开发之控制器用法实例分析
2016/02/05 PHP
[原创]php实现子字符串位置相互对调互换的方法
2016/06/02 PHP
TP3.2.3框架使用CKeditor编辑器在页面中上传图片的方法分析
2019/12/31 PHP
PhpStorm2020.1 安装 debug - Postman 调用的详细教程
2020/08/17 PHP
Javascript valueOf 使用方法
2008/12/28 Javascript
将函数的实际参数转换成数组的方法
2010/01/25 Javascript
可以用来调试JavaScript错误的解决方案
2010/08/07 Javascript
javascript一个无懈可击的实例化XMLHttpRequest的方法
2010/10/13 Javascript
idTabs基于JQuery的根据URL参数选择Tab插件
2012/04/11 Javascript
JavaScript中json使用自己总结
2013/08/13 Javascript
实现js保留小数点后N位的代码
2014/11/13 Javascript
jQuery实现可以控制图片旋转角度效果(附demo源码下载)
2016/01/27 Javascript
js获取当前页的URL与window.location.href简单方法
2017/02/13 Javascript
详解如何在Vue里建立长按指令
2018/08/20 Javascript
Vue 表情包输入组件的实现代码
2019/01/21 Javascript
JavaScript实现与web通信的方法详解
2020/08/07 Javascript
[00:47]DOTA2荣耀之路6:玩不了啦!
2018/05/30 DOTA
Windows系统配置python脚本开机启动的3种方法分享
2015/03/10 Python
Python装饰器使用实例:验证参数合法性
2015/06/24 Python
Python 常用 PEP8 编码规范详解
2017/01/22 Python
python实现textrank关键词提取
2018/06/22 Python
python tkinter界面居中显示的方法
2018/10/11 Python
使用APScheduler3.0.1 实现定时任务的方法
2019/07/22 Python
Python谱减法语音降噪实例
2019/12/18 Python
使用Python实现Wake On Lan远程开机功能
2020/01/22 Python
Python HTMLTestRunner测试报告view按钮失效解决方案
2020/05/25 Python
详解appium自动化测试工具(monitor、uiautomatorviewer)
2021/01/27 Python
Booking.com英国官网:全球酒店在线预订网站
2018/04/21 全球购物
美国林业供应商:Forestry Suppliers
2019/05/01 全球购物
餐厅采购员岗位职责
2014/03/06 职场文书
2014年党员承诺书范文
2014/05/20 职场文书
4种非常实用的python内置数据结构
2021/04/28 Python
MySQL数据库之内置函数和自定义函数 function
2022/06/16 MySQL