场景：在配置文件中取消了底部导航栏或者自定义导航栏，而隐藏了系统底部导航栏的，在有刘海屏的时候会出现如下的问题
图片.png
原因：这个问题是因为uniapp默认会为iPhone X（刘海屏）留出来安全距离，这个安全距离的背景色是默认的白色，所以如果你将页面颜色设置为其他颜色，就会与默认白色冲突。
两种解决方法
1、自动适应（推荐）
1、打开 manifest.json ，打开源码视图：
图片.png
2、找到 app-plus 配置项，添加以下代码：
"safearea": {"bottom": { "offset": "none" }
3、正确配置成功如下图所示：
图片.png
2、统一设置
将所有 iPhone X（刘海屏) 底部安全距离的背景色，统一设置 为一种颜色：
1、打开 manifest.json ，打开源码视图：
图片.png
2、找到 app-plus 配置项，添加以下代码：
"safearea": { "background": "#CCCCCC", //背景色"bottom": { "offset": "auto" } }
3、正确配置成功如下图所示：
图片.png
可参考官方文档：https://uniapp.dcloud.net.cn/collocation/pages.html#customnav
文章转载（做笔记记录）：http://e.betheme.net/article/show-327212.html?action=onClick
网友评论