uniapp 页面和状态栏重叠(安卓)

Jsky
2020-03-02 13:53:04
前端
Vue UniApp

top_view.vue 公共页面

<template>
	<view class="status_bar">
		<view class="top_view"></view>
	</view>
</template>

<script>
</script>

<style>
	.status_bar {
		height: var(--status-bar-height);
		width: 100%;
		background-color: #F8F8F8;
	}

	.top_view {
		height: var(--status-bar-height);
		width: 100%;
		position: fixed;
		background-color: #F8F8F8;
		top: 0;
		z-index: 999;
	}
</style>

index.vue 引用的页面

<template>
<view>
	<topView></topView>
</view>
</template>

<script>
	import topView from '../common/top_view.vue'
	export default {
		data() {
			return {}
		},
		components:{
			topView
		}
	}
</script>

本文为Jsky原创文章,转载无需和我联系,但请注明来自Jsky博客 www.tjin.link