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*/
}
相关推荐
天空属于哈夫克310 分钟前
企业微信API常见的错误和解决方案
java·数据库·企业微信
wenzhangli719 分钟前
Ooder A2UI 核心架构深度解析:WEB 拦截层的设计与实现
前端·架构
前端百草阁43 分钟前
【前端性能优化全链路指南】从开发编写到构建运行的多维度实践
前端·性能优化
摇滚侠1 小时前
VMvare 虚拟机 Oracle19c 安装步骤,远程连接 Oracle19c,百度网盘安装包
java·oracle
梁萌1 小时前
idea报错找不到XX包的解决方法
java·intellij-idea·启动报错·缺少包
女生也可以敲代码1 小时前
AI时代下的50道前端开发面试题:从基础到大模型应用
前端·面试
Agent产品评测局1 小时前
生产排期与MES/ERP系统打通,实操方法详解 —— 2026企业级智能体自动化选型与实战指南
java·运维·人工智能·ai·chatgpt·自动化
ZhengEnCi1 小时前
M5-markconv自定义CSS样式指南 📝
前端·css·python
阿丰资源1 小时前
基于Spring Boot的电影城管理系统(直接运行)
java·spring boot·后端
IT_陈寒1 小时前
SpringBoot自动配置的坑差点让我加班到天亮
前端·人工智能·后端