uniapp之Web-view遮挡导航方案

方案一:pages.json定义原生导航

{  

        "path": "pages/checkout/checkout",  

        "style": {  

            "app-plus": {  

                "navigationBarTitleText": "个人中心",  

                "titleNView": {  

                    "autoBackButton": false,  

                    "buttons": [{  

                        "float": "left",  

                        "type": "back"  

                    }]  

                }  

            }  

        }  

    },

方案二:API使用getAppWebview、getSystemInfo调整webview高度

onLoad() {
	let height = 0; //定义动态的高度变量
	let statusbar = 0; // 动态状态栏高度
	uni.getSystemInfo({ // 获取当前设备的具体信息
		success: (sysinfo) => {
			statusbar = sysinfo.statusBarHeight;
			height = sysinfo.windowHeight;
		}
	});
	let currentWebview = this.$scope.$getAppWebview(); //获取当前web-view
	setTimeout(function() {
		var wv = currentWebview.children()[0];
		wv.setStyle({ //设置web-view距离顶部的距离以及自己的高度,单位为px
			top: statusbar, //此处是距离顶部的高度,应该是你页面的头部
			height: height, //webview的高度
		})
	}, 200); //如页面初始化调用需要写延迟
}

  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值