tabbar未适配iPhone X及以上全面屏

[darkfiredarkhalo]

相关平台

H5

浏览器版本: 微信/Safari 使用框架: React

复现步骤

使用配置式Tabbar和Taro-UI的tabbar表现均为未适配, 底部的Home Indicator会遮挡tabbar,造成误操作

期望结果

适配iPhone X及以上带Home Indicator的系统

实际结果

tabbar未适配iPhone X及以上带Home Indicator的系统

环境信息

👽 Taro v3.2.1

  Taro CLI 3.2.1 environment info:
    System:
      OS: macOS 11.2.1
      Shell: 5.8 - /bin/zsh
    Binaries:
      Node: 12.16.1 - /usr/local/bin/node
      Yarn: 1.22.4 - /usr/local/bin/yarn
      npm: 7.6.3 - /usr/local/bin/npm
    npmPackages:
      @tarojs/cli: 3.2.8 => 3.2.8 
      @tarojs/components: 3.2.8 => 3.2.8 
      @tarojs/mini-runner: 3.2.8 => 3.2.8 
      @tarojs/react: 3.2.8 => 3.2.8 
      @tarojs/runtime: 3.2.8 => 3.2.8 
      @tarojs/taro: 3.2.8 => 3.2.8 
      @tarojs/webpack-runner: 3.2.8 => 3.2.8 
      babel-preset-taro: 3.2.8 => 3.2.8 
      eslint-config-taro: 3.2.8 => 3.2.8 
      react: ^17.0.0 => 17.0.2 
      taro-ui: ^3.0.0-alpha.3 => 3.0.0-alpha.10 

[darkfiredarkhalo]

复现方法(页面带TabBar, 任选其一):

• 微信扫码打开的第一个页面
• 手机浏览器Safari中隐藏工具栏
• Safari中添加到主屏幕, 然后在桌面打开

  异常表现:

• 底部的Home Indicator会遮挡tabbar
• TabBar分成了两层(应该是背景或者占位视图), 白色的部分会遮挡页面

[lehug]

关注,这么久了还没解决,响应太慢了呀~

[chj-damon]

实测在3.6.3上，用微信浏览器打开h5项目，还是会被遮挡