vue 对浏览器关闭、刷新的监听

在vue页面的mouted方法内添加

window.addEventListener('beforeunload', function(e) {
   e.preventDefault()
   e.returnValue = '刷新'
})

returnValue自定义文本无效原因：

在旧版本浏览器中，事件的返回值会被展示在对话框中。但从Firefox 44，Chrome 51，Opera 38，和Safari 9.1以后，返回文本将不会被展示，换言之，无法自定义弹窗提示文本。

默认的提示文本如下：

Firefox（66.0.3）“此页面想询问您是否要离开 - 您输入的数据可能不会被保存”
Safari（10.1.2）“您确定要离开此页面吗？”
Chrome（74.0.3729.131）“重新加载此网站？”“系统可能不会保存您所做的更改。”

alert，confirm，prompt不执行

在一些浏览器中，在onbeforeunload中调用alert，confirm，prompt等方法会被忽略。

onbeforeunload无效

之前遇到的情况是，在chrome中onbeforeunload事件时而执行时失效，以为是浏览器的兼容问题，百思不得其解，但后来发现如下解释：As of Chrome 60, the confirmation will be skipped if the user has not performed a gesture in the frame or page since it was loaded

在Chrome和Firefox中，页面加载完成后，如果用户未对页面进行操作，比如“点击”、“输入”等等，onbeforeunload将不会被执行。

而在Safari中onbeforeunload总是会被执行，12.0.3版本必须对页面操作才会执行

需要指出的是，许多浏览器会忽略该事件并自动关闭页面无需用户的确认。

火狐浏览器在配置页面about:config设有一个dom.disable_beforeunload的开关变量用于开启这个功能。