uniapp アプレットはナビゲーション バーの高さを計算します

コードは以下のように表示されます

<view :style="{ 'margin-top': `${statusBarHeight}px` }"></view>
data(){
    return{
        titleBarHeight: '',
		statusBarHeight: '',
    }
}
mounted() {
		// 导航栏距顶距离
		let menuButtonObject = uni.getMenuButtonBoundingClientRect(); //获取菜单按钮(右上角胶囊按钮)的布局位置信息。坐标信息以屏幕左上角为原点。
		uni.getSystemInfo({
			//获取系统信息
			success: res => {
				let navHeight = menuButtonObject.height + (menuButtonObject.top - res.statusBarHeight) * 2; //导航栏高度=菜单按钮高度+(菜单按钮与顶部距离-状态栏高度)*2
				this.titleBarHeight = navHeight;
				this.statusBarHeight = res.statusBarHeight;
                // 导航栏高度
				console.log(this.titleBarHeight);
                // 导航栏距顶高度
				console.log(this.statusBarHeight);
			},
			fail(err) {
				// console.log(err);
			}
		});
	},

おすすめ

転載: blog.csdn.net/weixin_46607967/article/details/129808447