<template>
	<view class="container">
		<view :style="{height: statusBarHeight + 'px'}"></view>
		<!-- <view :style="{height: navBarHeight + 'px'}"></view> -->
		<view class="page-content">
			主页
		</view>
	</view>
</template>

<script setup>
	import { ref } from 'vue'
	import { onReady, onLoad } from '@dcloudio/uni-app'
	
	// 屏幕状态栏高度
	const statusBarHeight = ref(0)
	// 顶部导航栏高度
	const navBarHeight = ref(0)
	
	onReady(() => {
		uni.getSystemInfo({
			success(e) {
				statusBarHeight.value = e.statusBarHeight;
				let custom = uni.getMenuButtonBoundingClientRect();
				navBarHeight.value = custom.height + (custom.top - e.statusBarHeight) * 2;
			}
		})
	})
	onLoad(() => {
		uni.setTabBarBadge({ //显示数字  
			index: 1, //tabbar下标
			text: '999' //数字
		})
	})
</script>

<style lang="scss" scoped>
	.container {
		height: 100vh;
		width: 100vw;
		background-color: #f7f7f7;
		padding: 0 20px;
	}
</style>
