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*/
}
相关推荐
严肃小白兔19 分钟前
TanStack Router 更新构建工具链:Node.js 兼容性、路由分割与前端工程实践
前端·node.js·状态模式
IT_陈寒35 分钟前
Vue这个奇葩的响应式问题让我加班到凌晨
前端·人工智能·后端
天天被压力1 小时前
【A股分钟级高频数据完全手册 #11】券商实时行情数据接口:实时交易(券商源)接入与字段
java·人工智能·python
风骏时光牛马1 小时前
功能可用性自动化测试验证
前端
天天被压力1 小时前
【A股分钟级高频数据完全手册 #12】股票五档盘口数据接口:买卖五档实时盘口解析
java·人工智能·python
Wang's Blog10 小时前
Java 项目实战: 交友项目 - FastDFS:入门案例
java·开发语言·交友
LucianaiB11 小时前
【元宝搜索开发者征文大赛】AI时代,学得慢就不用学?用元宝搜索打造一个教程保质期,确保每一个教程符合你的现状
前端·人工智能·ai编程
apcipot_rain11 小时前
C++转Java日记(03)
java·开发语言·c++
excel11 小时前
JavaScript 对象池:减少高频对象创建与 GC 压力
前端
皮皮林55111 小时前
Java实现微信扫码登录
java