当前位置: 首页 > article >正文

uniapp底部安全距离(safeAreaInsets)的实际应用

实际遇到的问题:页面底部的元素与 IOS 自带的导航条重叠了(图 1),调整后(图 2)

解决办法:safeAreaInsets获取屏幕边界到安全区域距离

// 获取屏幕边界到安全区域距离
    const { safeAreaInsets } = uni.getSystemInfoSync()

页面中增加一个 DOM 撑开 

<view :style="{ height: safeAreaInsets?.bottom*1.5 + 'px' }"></view>

我这个方法比较笨拙,因为增加了一个无用 DOM 消耗额外资源,应该用css 动态计算安全距离这些高阶玩法,但是我不会,有更有方案的评论区交流哈!!


http://www.kler.cn/a/291302.html

相关文章:

  • 如何使用el-table的多选框
  • 深浅拷贝~
  • 自动化测试、压力测试、持续集成
  • mac 安装 dotnet 环境
  • IDEA使用Auto-dev+DeepSeek 10分钟快速集成,让java开发起飞
  • Gurobi基础语法之 addConstr, addConstrs, addQConstr, addMQConstr
  • 07:【江科大stm32】:编码器通过定时器测速
  • 如何查看Mac的处理器架构‌‌是ARM还是x86
  • Sentence-BERT实现文本匹配【对比损失函数】
  • 机器学习之监督学习(二)二元逻辑回归
  • 【conda】理解 `conda` 和 `pip`:Python 包管理工具的全面对比与最佳实践
  • 云计算国标发布 云轴科技ZStack参编
  • 手动更新 windows 补丁
  • Unity坐标系计算3D中两直线的最短距离及最近点的几何原理
  • 交换机自动化获取诊断(H3C_无人值守)
  • 2024跨境必备的软件-产品优化AI智能工具,支持Shopee、TikTok Shop、TEMU、Lazada等
  • 页面小组件-搜索栏(一)
  • django models字段类型和参数的选择
  • 假期学习-- iOS runtime的简单了解
  • vs2022 如何去掉 错误|警告的波形曲线 绿色波浪线
  • 【Python】简单的数据类型——int、float、bool、str
  • 【Linux】易忘操作集合
  • uniapp个人健康预警管理系统 微信小程序的设计与实现 38vk1
  • 2024年【陕西省安全员B证】考试题及陕西省安全员B证最新解析
  • Rust模块std::thread
  • 双指针--优选算法