如何在 vue.js 中检测页面是否刷新答案

【问题标题】：How to detect page is refreshed in vue.js如何在 vue.js 中检测页面是否刷新
【发布时间】：2018-10-27 04:12:31
【问题描述】：

我想在 vue.js 中检测页面何时刷新或重新加载。我已经阅读了这篇文章Do something before reload or close in vue.js 中的问题。它正在使用 window.onbeforeunload。但对我来说问题是，我该把这个窗口函数放在哪里？我们可以使用 vuejs 的另一种默认方法来检测刷新的页面吗？谢谢

【问题讨论】：

例如你可以把它放在根 App 组件的 created 钩子中
如何在创建/更改为localStorage 或sessionStorage 之类的数据时保留数据？为什么要等待某种“卸载”钩子？
@JacobGoh 想举个例子:-)
@Phil 我已经编辑了我的问题。它应该与保存数据无关
查看codesandbox.io/s/v6ll6mpr6l中的App.vue

标签： vue.js

【解决方案1】：

您可以使用创建的函数来调用另一个函数。示例：

created() {
  window.addEventListener('beforeunload', this.handler)
},
methods: {
  handler: function handler(event) {
      // Do Something
  }
}

or

created() {
      window.addEventListener('beforeunload', function(event) {
         event.returnValue = 'Write something'
      })
    },

检查一下：https://forum.vuejs.org/t/detect-browser-close/5001/8

【讨论】：

别忘了在 beforeDestroy 上移除添加的事件监听器。否则你可能会有很多未使用的事件监听器拖慢你的应用程序。
在 safari 上不再支持 beforeunload。