微信小程序：解决顶部被遮挡的问题
你们好，我是金金金。
场景
发布了一个小程序，测试过程当中，发现问题：顶部的轮播图被
IOS的灵动岛给挡住了
好家伙，确实不太美观昂~
解决
解决微信小程序元素内容被顶部栏遮挡的问题也非常简单
uniapp提供了一个同步接口函数：uni.getSystemInfoSync()，这玩意会返回一堆东西，拿到safeAreaInsets，safeAreaInset官方说明：在竖屏正方向下的安全区域插入位置，意思呢就是它能获取到设备的安全区域 直接排除掉这个安全区域的高度那么就不会存在遮挡问题
文档：https://uniapp.dcloud.net.cn/api/system/info.html#safearea
代码
-
首先拿到需要的
safeAreaInsets
-
在元素上
padding对应的高度即可
测试
-
微信开发者工具测试
可以看到，顶部其实已经被隔离开了 没有被压住了
- 真机俺也测试了，就不贴图了~
总结
内容被顶部栏遮挡了，排除掉对应区域即可~
- 编写有误还请大佬指正，万分感谢。