第一我们在onLoad中获取系统一些手机信息,并且设置webview距屏幕顶部高度(避免遮挡状态栏),以及设置高度
为什么ios中定义Webview高度(屏幕可视高度 – 状态栏高度),webview内部的tabbar会遮挡最底部元素呢?
由于ios底部会有个安全高度,也就是距离最底部还是有个bottom,也就是ios打开app会把app顶起来必定高度,测试多个ios,发现都是34px
webview内部的tabbar一般都是fix定位,我们的底部被顶起来了34px,但是我们整体webview高度设置的又多了这34px,所以内容部分也就会被tabbar顶起来的这部分给遮挡住
所以我们设置webView高度,需要这样设置(屏幕可视高度 – 状态栏高度 – 系统底部高度)
webview内部点击Input,键盘遮挡Input,可使用uni.onWindowResize方法,当安卓打开键盘时,会触发窗口尺寸变化,并返回实时的屏幕高度,所以我们需要重新设置webview高度,即可让键盘不遮挡Input.
onLoad: function() {
let windowHeight = 0;
let statusbarHeight = 0;
let safeAreaInsetsBottom = 0;
uni.getSystemInfo({
success: (sysInfo) => {
statusbarHeight = sysInfo.statusBarHeight;
windowHeight = sysInfo.windowHeight;
safeAreaInsetsBottom = sysInfo.safeAreaInsets.bottom;
}
});
let webview = this.$scope.$getAppWebview();
setTimeout(function() {
reloadView = webview.children()[0];
reloadView.setStyle({
top: statusbarHeight,
height: windowHeight - statusbarHeight - safeAreaInsetsBottom
});
reloadView.evalJS( document.cookie ="CK_ISO_CODE=sg;domain=.thermofisher.com;path=/" );
reloadView.reload();
}, 1000);
uni.onWindowResize((res) => {
setTimeout(function() {
reloadView.setStyle({
height: res.size.windowHeight - statusbarHeight - safeAreaInsetsBottom,
})
}, 100);
})
},
© 版权声明
文章版权归作者所有,未经允许请勿转载。如内容涉嫌侵权,请在本页底部进入<联系我们>进行举报投诉!
THE END
















暂无评论内容