项目中如果要去掉导航栏的话,状态栏就会自动开启沉浸式,这时候就需要解决这个状态栏的问题,目前找到以下两个方法解决:
1、最简单的解决方式就是配置mainfest.json来关闭沉浸式。即通过打开应用的manifest.json文件,切换到代码视图,在app-plus -> statusbar 下添加immersed节点并设为false。
"app-plus" : {
"statusbar": {
"immersed": false
},
}
2、其次可通过顶部状态栏占位的方式来解决页面的状态栏的问题
<template>
<view>
<view class="status_bar">
<!-- 这里是状态栏 -->
</view>
<view> 状态栏下的文字 </view>
</view>
</template>
<style>
.status_bar {
height: var(--status-bar-height);
width: 100%;
}
</style>