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*/
}
相关推荐
梦梦代码精2 分钟前
基于ThinkPHP6 + Vue3的家政预约系统全解析:从LBS定位到自动派单的完整实现
java·docker·开源·php·代码规范
顺颂时绥_13 分钟前
前端大图片压缩与安卓/苹果设备矫正实践
前端
Csvn5 分钟前
JSON.parse 大数精度丢失:一个让前后端互相甩锅的 Bug
前端
wear工程师10 分钟前
@Transactional 标了却没开事务?先看这次调用有没有经过代理
java·spring
Joey_friends11 分钟前
指纹authenticate流程图
android·java·c++
2501_9160074713 分钟前
深入理解HTTPS对称与非对称加密机制及Charles抓包实践
网络协议·http·ios·小程序·https·uni-app·iphone
Helen_cai24 分钟前
OpenHarmony 项目统一全局样式、尺寸、色彩主题封装 ThemeUtil(API23)
开发语言·前端·javascript·华为·harmonyos
郑州光合科技余经理25 分钟前
家政O2O平台解析:从0搭建上门预约小程序解决方案
android·java·开发语言·前端·小程序·架构·php
小徐_233336 分钟前
AI 写 wot-ui 总在猜 API?我们把 Skills、MCP 和 CLI 都配好了
前端·uni-app·ai编程
winfredzhang41 分钟前
用 wxPython + ECharts + 阿里矢量地图,做一个可离线兜底的上海雨量看板
前端·javascript·echarts