uniapp H5中ios跳转后返回上一页页面白屏

使用uniapp开发的H5页面中,使用window.location.href跳转到别的系统页面(就是A-H5页面跳转到B-H5页面),返回上一页时(就是B回退到A时),ios系统页面出现了白屏,而Android端没问题。

处理方法之一:

//先获取并判断当前处于什么系统,如何获取当前页面处于什么手机系统可通过uniapp提供的uni.getSystemInfo
if(whatSystem == "iPhone"){
   window.onpageshow = function(event) {
       if (event.persisted) {
          window.location.reload()
       }
   };
}

处理方法之二:

//先判断白屏页面的高度为0,再刷新页面
this.$nextTick(()=>{
	const query = uni.createSelectorQuery().in(this);
	query.select('#home').boundingClientRect(data => {
		 if(data.height == 0){  
			window.location.reload();
		 }
	 }).exec();
})

补充记录一下:window.onpageshow 事件

onpageshow 事件在用户浏览网页时触发。
onpageshow 事件类似于 onload 事件,onload 事件在页面第一次加载时触发, onpageshow 事件在每次加载页面时触发,即 onload 事件在页面从浏览器缓存中读取时不触发。
为了查看页面是直接从服务器上载入还是从缓存中读取,你可以使用 PageTransitionEvent 对象的 persisted 属性来判断。 如果页面从浏览器的缓存中读取该属性返回 ture,否则返回 false。

你可能感兴趣的:(H5,uniapp,uni-app,javascript,开发语言,ios,android)