由于在微信小程序的webview中无法统一在小程序端适配iPhone下的黑条问题,当然自定义TabBar也有同样的问题,整个网页无法在webview中设置样式让下面空出来,这样一来,网页的底部就跟黑条重合,若有自定义TabBar则也会遮挡住网页底部内容。效果如下:
为解决这个问题,我们通过将所有网页统一在固定的iframe中打开,然后将iframe设置安全的下边距来解决。
解决后的效果:
虽然底部遮挡问题已经解决了,又出现新的问题,就是网页中 jsapi 中的 ready 函数没有回调,相应的 error 也没有被执行,怀疑是微信阻止了我们这样做。
于是,我们想到在 iframe 也来初始化 jsapi 然后在其子页面直接使用其父页面初始化好的 jsapi,经过试验,完美解决!