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*/
}
相关推荐
Zane199410 分钟前
遍历时删元素为什么报错:modCount 这个"计数器"在背后盯着你
java·后端
半个落月12 分钟前
从 CSR 到 Server Component:吃透 Next.js 16 App Router 路由、布局与 SEO
前端·next.js
七牛开发者18 分钟前
拆解 DeepSeek Harness:Profile 与 Bundle 如何装配运行时
前端·javascript·后端
葡萄城技术团队25 分钟前
表格智能体系列 · 1:一句话怎么变成一次表格操作
前端
梦曦i31 分钟前
Vue-Router 2.4.0 新增可控重定向功能
前端·uni-app
deli0070071 小时前
Markdown 实时预览器:左边写右边看,排版效率翻倍
前端·ai编程
电商API_180079052471 小时前
速卖通商品采集API技术文章
java·开发语言·c++·api·跨境电商·商品详情
郑州光合科技余经理1 小时前
海外版外卖系统架构:订单怎么流转、权限怎么分
java·开发语言·前端·系统架构·uni-app·php·ai编程
pengyu1 小时前
【Kotlin 协程修仙录 · 炼虚境 · 初阶】 | 虚空造物:Channel 基础与协程间通信的管道艺术
android·前端·kotlin
提线木偶1 小时前
CORS 到底谁说了算?一份跨域配置的避坑指南
前端·后端