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*/
}
相关推荐
廋到被风吹走17 小时前
【Spring】Spring Data JPA Repository 自动实现机制深度解析
java·后端·spring
MX_935917 小时前
Spring中Bean的配置(一)
java·后端·spring
2503_9284115617 小时前
12.4 axios的二次封装-深拷贝
前端·javascript·vue.js
你真的可爱呀20 小时前
uniapp+vue3项目中的常见报错情况以及解决方法
前端·vue.js·uni-app
sg_knight21 小时前
Spring 框架中的 SseEmitter 使用详解
java·spring boot·后端·spring·spring cloud·sse·sseemitter
郑州光合科技余经理1 天前
同城系统海外版:一站式多语种O2O系统源码
java·开发语言·git·mysql·uni-app·go·phpstorm
一只乔哇噻1 天前
java后端工程师+AI大模型开发进修ing(研一版‖day60)
java·开发语言·人工智能·学习·语言模型
Dolphin_Home1 天前
笔记:SpringBoot静态类调用Bean的2种方案(小白友好版)
java·spring boot·笔记
博客zhu虎康1 天前
uniApp 开发
arcgis·uni-app
差点GDP1 天前
模拟请求测试 Fake Rest API Test
前端·网络·json