vue如何监听浏览器主动刷新

 更新时间:2022年04月22日 10:50:00   作者:诺小D  
这篇文章主要介绍了vue如何监听浏览器主动刷新,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

监听浏览器主动刷新

 mounted() {
             window.addEventListener('beforeunload', e => this.beforeunloadHandler(e))   //监听页面刷新触发事件
        },
 methods(){
  		beforeunloadHandler(e) {    //根据事件进行操作进行操作
                console.log(e)
                console.log('浏览器刷新') 
            },
},
destroyed () {  //进行监听销毁
            window.removeEventListener('beforeunload', e =>this.beforeunloadHandler(e))
},
        

监听刷新事件如何写?

在网上找了很多都不能用,用下方这串代码,亲测有用,直接放在mounted执行即可:

 mounted() {
    window.addEventListener("load", () => {
      //写入你想要执行的代码
    });
  },

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • Vue实现Hover功能(mouseover与mouseenter的区别及说明)

    Vue实现Hover功能(mouseover与mouseenter的区别及说明)

    这篇文章主要介绍了Vue实现Hover功能(mouseover与mouseenter的区别及说明),具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-10-10
  • vue swipeCell滑动单元格(仿微信)的实现示例

    vue swipeCell滑动单元格(仿微信)的实现示例

    这篇文章主要介绍了vue swipeCell滑动单元格(仿微信)的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-09-09
  • vue element如何添加遮罩层

    vue element如何添加遮罩层

    这篇文章主要介绍了vue element如何添加遮罩层问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-03-03
  • vue如何修改浏览器的标题title

    vue如何修改浏览器的标题title

    这篇文章主要介绍了vue如何修改浏览器的标题title问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-10-10
  • Vue项目中使用vuex详解

    Vue项目中使用vuex详解

    Vuex是一个专为Vue.js应用程序开发的状态管理模式,它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化,下面这篇文章主要给大家介绍了关于vuex模块获取数据及方法的相关资料,需要的朋友可以参考下
    2023-03-03
  • vue3 父控件远程获取数据在子组件上显示不出来的解决方案

    vue3 父控件远程获取数据在子组件上显示不出来的解决方案

    这篇文章主要介绍了vue3 父控件远程获取数据,在子组件上显示不出来,本文给大家分享两种解决方案帮助大家解决这个问题,需要的朋友可以参考下
    2023-08-08
  • vue基于两个计算属性实现选中和全选功能示例

    vue基于两个计算属性实现选中和全选功能示例

    这篇文章主要介绍了vue基于两个计算属性实现选中和全选功能,结合实例形式分析了vue计算属性get及set操作页面元素实现选中与全选功能相关操作技巧,需要的朋友可以参考下
    2019-02-02
  • vue使用qrcode生成二维码的方法

    vue使用qrcode生成二维码的方法

    这篇文章给大家介绍了vue使用qrcode生成二维码的方法,在Vue中实现二维码生成需要使用第三方库来处理生成二维码的逻辑,常用的库有qrcode和vue-qrcode,所以接下来小编将给大家介绍vue qrcode生成二维码的方法示例,需要的朋友可以参考下
    2024-01-01
  • Elementui el-input输入框校验及表单校验实例代码

    Elementui el-input输入框校验及表单校验实例代码

    输入框是使用非常多的元素,用来输入用户名、密码等等信息,Element提供了功能和样式丰富的输入框,下面这篇文章主要给大家介绍了关于Elementui el-input输入框校验及表单校验的相关资料,需要的朋友可以参考下
    2023-06-06
  • 详解vue中this.$emit()的返回值是什么

    详解vue中this.$emit()的返回值是什么

    这篇文章主要介绍了详解vue中this.$emit()的返回值是什么,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04

最新评论