Vue中判断是刷新页面还是关闭页面操作

最近在做项目是遇到一个需求，如果是第一次进入页面关闭页面下次再进来就不弹出引导层，如果第一次进入页面之后刷新页面引导层一直存在，因此就想着判断我们当前的操作是刷新页面还是关闭页面，所有有了下面操作

在vue页面中使用localStorage存储定义的标识，在关闭浏览器的时候删除标识,刷新浏览器不做操作

在需要进行操作的vue页面中添加以下代码

mounted() {
    let beginTime = 0; //开始时间
    let differTime = 0; //时间差
    window.onunload = function() {
      differTime = new Date().getTime() - beginTime;
      if (differTime <= 5) {
        localStorage.removeItem('aitoken');
        localStorage.removeItem('userInfo');
        localStorage.removeItem('isLogin');
        console.log("这是关闭");
      } else {
        console.log("这是刷新");
      }
    };
    window.onbeforeunload = function() {
      beginTime = new Date().getTime();
    };
}

解析刷新页面和关闭页面执行的方法：unbeforeunload 和onunload

• unbeforeunload（）事件执行的顺序在onunload()事件之前发生。(因为，unbeforeunload()是在页面刷新之前触发的事件，而onubload()是在页面关闭之后才会触发的)。
• unbeforeunload（）事件可以禁止onunload()事件的触发。
• onunload()事件是无法阻止页面关闭的。