最近在做我的项目是遇到一个需要,如果是第一次进入页面敞开页面下次再进来就不弹出疏导层,如果第一次进入页面之后刷新页面疏导层始终存在,因而就想着判断咱们以后的操作是刷新页面还是敞开页面,所有有了上面操作
在 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()事件是无奈阻止页面敞开的。