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*/
}
相关推荐
咕噜咕噜啦啦18 分钟前
Java期末习题速通
java·开发语言
奔跑的web.18 分钟前
TypeScript Enum 类型入门:从基础到实战
前端·javascript·typescript
盐真卿35 分钟前
python2
java·前端·javascript
梦梦代码精1 小时前
BuildingAI vs Dify vs 扣子:三大开源智能体平台架构风格对比
开发语言·前端·数据库·后端·架构·开源·推荐算法
一嘴一个橘子2 小时前
mybatis - 动态语句、批量注册mapper、分页插件
java
组合缺一2 小时前
Json Dom 怎么玩转?
java·json·dom·snack4
seabirdssss2 小时前
《bootstrap is not defined 导致“获取配置详情失败”?一次前端踩坑实录》
前端·bootstrap·html
危险、2 小时前
一套提升 Spring Boot 项目的高并发、高可用能力的 Cursor 专用提示词
java·spring boot·提示词
kgduu2 小时前
js之表单
开发语言·前端·javascript
kaico20182 小时前
JDK11新特性
java