Uni-App开发是刘海屏适配问题

最近开始尝试使用HBuliderX开发uni-app app，遇到刘海屏适配的问题，查看多个demo后发现，需要引用样式

<template>

    <view class="content">

<!--设置view占用通知栏-->
        <view class="title-padding"></view>

        <!--样式布局页面--> 

        .......

    </view>
</template>

.titleNview-placing {
        height: var(--status-bar-height);
        padding-top: 44px;
        box-sizing: content-box;
    }

这样就能适配刘海屏了

 

或者在pages.json里面配置"navigationBarTitleText": "xxxx",使用框架的导航栏