微信小程序uniapp解决真机顶部自定义菜单显示(手机状态栏覆盖)

发布时间 2023-07-03 17:06:26作者: zhang_you_wu

1.在data里面加入参数

statusBarHeight: uni.getSystemInfoSync ().statusBarHeight,//状态栏高度

2.对返回按钮处理

    <!-- 空出状态栏高度-->
    <view :style="'height:'+statusBarHeight+'px;'"></view>
    <!-- 返回按钮 -->
    <div class="font-30 font-bold color-white" style="height: 44px;line-height: 44px; display: flex;align-items: center;padding-left: 10px;" @click="closePage()">
            <u-icon name="arrow-left" size="30" class="color-white"></u-icon>
            <text class=" ml10">返回</text> 
    </div>