H5页面在ios的浏览里返回不刷新页面,解决浏览器自带缓存的问题。
H5页面在ios的浏览里返回不刷新页面,解决浏览器自带缓存的问题。
·
1.利用pageshow来解决:
pageshow的web-api: pageshow - Web API 接口参考 | MDN
2.解决:
在app.vue里面
isPageHide = false; //定义变量
created(): void {
window.addEventListener("pageshow", this.refreshPage);
window.addEventListener("pagehide", this.refreshPageHide);
}
beforeDestroy(): void {
window.removeEventListener("pageshow", this.refreshPage);
window.removeEventListener("pagehide", this.refreshPageHide);
}
refreshPage(event: PageTransitionEvent): void {
console.log("");
console.log("refreshPage >>> this.isPageHide", this.isPageHide);
console.log("refreshPage >>> event", event);
console.log("refreshPage >>> event.persisted", event.persisted);
//pageshow里的 persisted 属性 表示网页是否是来自缓存。
if (this.isPageHide && event.persisted) {
window.location.reload();
}
}
refreshPageHide(): void {
//网页有缓存,第一次离开页面时执行。返回当前页时isPageHide为true。
this.isPageHide = true;
}
更多推荐
已为社区贡献3条内容
所有评论(0)