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*/
}
相关推荐
用户0304805912631 分钟前
Spring Validation教程
java
Hello.Reader2 分钟前
DTO / VO / BO / Entity 分层到底怎么用?
java·分层
云梦谭4 分钟前
AI 生成的FreeSWITCH 呼出流程深度分析freeswitch-1.10.12.-release
java·前端·php
秃了才能变得更强8 分钟前
React Native小技巧
前端
一只爱吃糖的小羊8 分钟前
React 19 vs Vue 3:深度对比与选型指南
前端·vue.js·react.js
前端老宋Running9 分钟前
Vue 3 的“降维打击”:Composition API 是如何让 Mixin 成为历史文物的?
前端·javascript·vue.js
随机昵称_1234569 分钟前
RSA私钥解密乱码问题
java·非对称加密
Pluto_CRown9 分钟前
H5 开发的各类小知识点
前端·javascript
Pluto_CRown10 分钟前
上下文存储【下】
前端·javascript
AAA阿giao11 分钟前
JavaScript 中基于原型和原型链的继承方式详解
前端·javascript·面试