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*/
}
相关推荐
HjhIron2 分钟前
在浏览器中跑DeepSeek-R1:用React+WebGPU实现端侧AI推理
前端·ai编程
学习使得吾快乐11 分钟前
时序数据库 TDengine 在设备监测中的实际落地:从传感器上报到实时看板
java·时序数据库·tdenginne
早期的虫儿有鸟吃15 分钟前
vue2--Vuex 模块化
开发语言·前端·javascript
程序员清风20 分钟前
推荐几个我常听的AI播客!
java·后端·面试
C++、Java和Python的菜鸟29 分钟前
第5章 后端Web基础 (MySQL基础)
前端·mysql·adb
门前大桥下.38 分钟前
HTML-01我的第一个网页
前端·html
唐青枫41 分钟前
Java Gradle 实战指南:从 Wrapper、Kotlin DSL 到 Spring Boot 多模块构建
java·kotlin·gradle
wuqingshun31415943 分钟前
如何理解Spring Boot中的starter?
java·spring boot·后端
带刺的坐椅44 分钟前
Solon TeamAgent 协作协议:从 SEQUENTIAL 流水线到 HIERARCHICAL 主管团队
java·ai·llm·agent·solon
我是大卫1 小时前
【图】React源码解析-从数据结构、依赖追踪机制、值传播与更新触发、以及性能陷阱与优化,深挖useContext的底层原理
前端·react.js·源码