一,在 created中 注册 页面刷新和关闭事件
created() {
 window.addEventListener('beforeunload', e => this.test(e))
}
 
二,事件,将你的逻辑方法加进去
methods: {
 test(e) {
  console.log('刷新或关闭')
  // ...
 }
}
三,卸载注册的事件
destroyed() {
 window.removeEventListener('beforeunload', e => this.test(e))
}

Vue - 监听页面刷新和关闭的更多相关文章

  1. vue 监听页面宽度变化 和 键盘事件

    vue 监听页面窗口大小 export default { name: 'Full', components: { Header, Siderbar }, data () { return { scr ...

  2. vue监听页面大小变化重新刷新布局

    在项目中由于某些div元素在布局的时候需要初始化宽高,因为当浏览器缩小屏幕的时候需要重新刷新页面视图. 分析思路: 1.在store中创建state,用于保存当前浏览器的宽.高值. 2.在mounte ...

  3. js 监听浏览器刷新还是关闭事件 - 转

    监听页面关闭: window.onbeforeunload = function() { //鼠标相对于用户屏幕的水平位置 - 窗口左上角相对于屏幕左上角的水平位置 = 鼠标在当前窗口上的水平位置 v ...

  4. javascript如何监听页面刷新和页面关闭事件

    本文转之http://www.qqtimezone.top 在我们的日常生活中,时常遇到这么一种情况,当我们在点击一个链接.关闭页面.表单提交时等情况,会提示我们是否确认该操作等信息. 这里就给大家讲 ...

  5. vue监听页面中的某个div的滚动事件,并判断滚动的位置

    在开发中常常会遇到这样一个vue页面,页面分为左右两部分,左边是目录树,右边是一个类名为xq-box的div,在xq-box中多个div上下并列布局,每个div中的内容就对应着左边目录树中的相应节点, ...

  6. js 监听浏览器刷新还是关闭事件

    转载大神 http://www.cnblogs.com/gavin0517/p/5827405.html

  7. vue中监听页面滚动和监听某元素滚动

    ①监听页面滚动 在生命周期mounted中进行监听滚动: mounted () { window.addEventListener('scroll', this.scrollToTop) }, 在方法 ...

  8. vue 中监听页面滚动

    监听页面滚动 在methods中定义一个方法 handleScroll() { //获取滚动时的高度 let scrollTop = window.pageYOffset || document.do ...

  9. Vue跨路由触发事件,Vue监听sessionStorage

    近来,在做公司的聊天系统,引用的是极光的api.项目需求实时监听别人发过来的消息,进行渲染到页面,还有历史记录也要渲染,历史记录和实时聊天记录返回的结构体还不一样,看到需求的我欲哭无泪,首先登录是在首 ...

随机推荐

  1. asp.net 大文件上传配置

    <system.web> <httpRuntime requestValidationMode=" ></httpRuntime> <!--单位:K ...

  2. CF1208G Polygons 数论

    题目链接:https://codeforces.com/contest/1208/problem/G 题意:给定两个正整数\(n\)和\(k\),询问在一个圆上你最少需要几个点,才能在这些点上构造出\ ...

  3. 「JSOI2016」灯塔

    「JSOI2016」灯塔 传送门 我们先只计算照亮左边的灯塔的最低高度,计算右边的类同,然后只要取 \(\max\) 就好了. 那么稍微整理一下式子:\(p_i \ge h_j - h_i + \sq ...

  4. Mac系统中桌面图片和用户头像图片的路径

    系统中的桌面图片: /Library/Desktop Pictures/ 用户头像图片: 根目录资源库/user pictures/ 参考: [https://bbs.feng.com/read-ht ...

  5. AMD R7 2700X 安装虚拟机

    自己组装的台式机,选用的是微星X470主板,该主板默认的虚拟化技术是关闭的,在bios中也不太容易找到,具体方法如下. [开机或重启]--[按住DEL进入BIOS]--[高级模式F7]--[选择OC] ...

  6. maven搭建父子项目

    父工程:父工程又称为父控制器,只是一个简单的工程,不能单独运行.作用是将子模块跟子工程聚合在一起.父控制器中的pom.xml配置,在子模块跟子工程中都可以被继承. 子工程:项目中创建的具有业务逻辑并且 ...

  7. touchstart和click 自动区分

    var clickEvent = (function() { if ('ontouchstart' in document.documentElement === true) return 'touc ...

  8. 缓存验证Last-Modified和Etag的使用

    缓存工作示意图: 在http协议里面,数据的验证方式,主要有两个验证头:Last-Modified 和 Etag. Last-Modified 配合Last-Modified-Since或者If-Un ...

  9. Linux - Shebang(#!)

    1. Shebang这个符号通常在Unix系统的脚本中第一行开头中写到,它指明了执行这个脚本文件的解释程序.

  10. Linux 的三种软件安装包介绍

    通过RPM软件包来安装 说起RPM(RedHat Package Management)标准的软件包,大家可能都会想起大名鼎鼎的REDHAT公司,正是RPM软件包发行方式的出现,使Linux中的应用软 ...