uniapp 苹果安全域适配

一、使用原生占位(仅App端支持)
复制代码
//在manifest.json 文件中 app-plus 中配置
"safearea": {  
    "background": "#FFFFFF",  
    "bottom": {  
        "offset": "auto"  
    }  
}
二、不使用原生占位
复制代码
//(非App端可以不在manifest中配置)
"safearea": {  
    "bottom": {  
        "offset": "none"  
    }  
}

获取系统信息

复制代码
 uni.getSystemInfo({
      success: (info) => {
        // 判断是否为iOS设备
        if (info.platform === 'ios') {
          // 去判断显示 安全边距
        }
      }
    });

动态绑定css 显示安全边距

复制代码
.xxx-view {  
    // 写在需要添加底部边距的盒子上
    padding-bottom: constant(safe-area-inset-bottom); /*兼容 IOS<11.2*/
    padding-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/
}
相关推荐
大飞哥~BigFei3 分钟前
新版chrome浏览器安全限制及解决办法
java·前端·chrome·安全·跨域
hepingfly4 分钟前
SEO 如何寻找关键词?
前端
IT_陈寒7 分钟前
SpringBoot 3.2实战:5个性能优化技巧让你的应用提速50%
前端·人工智能·后端
{Hello World}10 分钟前
Java多态:三大条件与实现详解
java·开发语言
老蒋每日coding10 分钟前
Java解析Excel并对特定内容做解析成功与否的颜色标记
java·开发语言·excel
lang2015092811 分钟前
Java反射利器:Apache Commons BeanUtils详解
java·开发语言·apache
m0_7482459211 分钟前
SQLite 数据类型概述
java·数据库·sqlite
扶苏100214 分钟前
前端js高频面试点汇总
开发语言·前端·javascript
firstacui15 分钟前
Keepalived 双主热备和三主热备
前端·chrome