uni-app web-view 组件IOS异常
现象描述
基于 uni-app 开发的 h5 应用,安卓端正常,ios 显示异常。当页面滚动后 IOS 嵌入的 web-view 内容莫名被置顶隐藏了,导致内容不可见。示意图如下:
解决思路
- 根据 uni-app 官网的描述,可以为 web-view 指定宽度-高度等尺寸,将 web-view 的宽高指定为
100 vw / 100 vh
错误现象依然存在。 - 网友提供的解决方案:经测试问题依旧。
<view style="width: 100%;height: 100%;">
<web-view :src="webUrl" />
</view>
- 将 web-view 标签替换为 Iframe 标签,并将 iframe 标签的宽度高度设置为
100 vw / 100 vh
网页完美嵌入,问题解决。
解决办法
<iframe
:src="url"
style="width:100vw;height:100vh"
></iframe>