uniapp自定义标题全机型适配

Posted 2022-12-08 哈尔滨洛弘科技有限公司

uniapp开发中，我们经常遇到自定义标题的时候，但是现在市面机型各式各样所以我们需要为各种手机做适配，今天我们共享下所有手机标题适配的开发，来干货

获取当前机型的顶部保护高度

var sale_top=uni.getSystemInfoSync().safeArea.top;

在wxml顶部预制一个顶部view

<view :style="safe_view"></view>

设置style样式 js

这里是引用

this.safe_view = 'height:'+sale_top+'px';

展示效果