vue解决微信浏览器自带导航条造成项目tabbar不显示的问题

案例如下:
1)在微信浏览器打开此页面,项目自身带tabbar,包括首页,发现 我的
在这里插入图片描述
2)点击为您推荐的第一个 pzm测试-食-图片,跳转到其他页面,下图为跳转页面,可以看到下方的图片已经出现了微信浏览器自带的导航条,用于前进后退。

在这里插入图片描述
3)然后点击上方红色框的返回键,得到下图,出现了微信浏览器自带的导航条,而我自己的首页,发现,我的导航条没了!!然后我在android机上测试是有的 ios上没有项目的tabbar
在这里插入图片描述

解决方法:
参考文章:https://www.jianshu.com/p/6df78215d769
在App.vue中加入下面代码:
在这里插入图片描述
这段代码的意思是当进入项目,如果是ios,自动打开微信浏览器自带导航条就可以了,造成上面的原因是原因微信浏览器的原因,第一次进入微信自带的导航条是不显示的,然后跳转到别的页面在返回就会造成项目的布局有问题,导致项目的tabbar不显示
window.history.pushState({}, “title”, “#”) 这段代码的意思是给浏览器塞一个空的路径让她显示就行啦

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值