微信小程序部分安卓手机获取safeArea.top异常

最近开发微信小程序，使用官方的自定义导航组件navigation-bar，在使用过程中，发现部分安卓手机头部样式有些异常，详细查看代码之后，初步判断是safeArea.top获取异常，调试之后，确实safeArea.top等于0，理论上这个值应该是40左右，所以记录一下，避免大家踩坑！解决方案会放在最后。以下是发生异常的条件：

手机型号及系统版本
红米Turbo 3
微信版本
8.0.50
正常样式

异常样式

此操作必现异常

目前较多的解决方式有两种：

一是写死高度，这个高度大概是88px左右，适用于大多数手机。

二是使用statusBarHeight代替safeArea.top，相比之下，推荐此方法。
代码如下：

   if( isAndroid ) {
       if( (res.safeArea.top == 0 || res.safeArea.top == undefined) && res.statusBarHeight > 0 ) {
           res.safeArea.top = res.statusBarHeight;
       } else {
           res.safeArea.top = 40; // 这个只是为了以防万一，暂时没有此情况
       }
   }

效果体验，请扫以下小程序码

– end –