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

小程序适配底部安全距离

 方案一

<view style="padding-bottom: {{safeBottom + 10}}px;"></view>
onLoad(options) {
    const { screenHeight, safeArea, windowHeight } = wx.getWindowInfo()
    let safeBottom = windowHeight
    if (safeArea?.bottom) {
      safeBottom = safeArea.bottom
    }
    safeBottom = screenHeight - safeBottom
    this.setData({
      safeBottom
    })
}

方案二(推荐)

padding-bottom: constant(safe-area-inset-bottom); /* 兼容iOS < 11.2 */  
padding-bottom: env(safe-area-inset-bottom); /* 兼容iOS > 11.2 */


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

相关文章:

  • 深度学习 Pytorch 张量的索引、分片、合并以及维度调整
  • ASP.NET Core WebApi接口IP限流实践技术指南
  • 【Web】Web API 简介
  • 网管平台(进阶篇):路由器的管理实践
  • MySQL NaviCat 安装及配置教程(Windows)【安装】
  • CentOS 9 Stream 上安装 Node.js 18.20.5
  • 静态综合路由实验
  • b站视频(网页加客户端)+本地视频 生成回链
  • Git克隆报错
  • 【Element Plus系列】解决 DatePicker 组件清空时,触发两次change
  • STM32 FreeRTOS 事件标志组
  • 华为云Ubuntu中安装配置PostgreSQL与PostGIS
  • Hadoop 和 Spark 的内存管理机制分析
  • cuda 中BYTE*
  • 学习javaweb不懂得知识点或者细节
  • minio https配置
  • 【Docker】——安装Docker以及解决常见报错
  • 4、dockerfile实现lnmp
  • Python----Python高级(函数式编程,迭代器,生成器,装饰器)
  • Ettercap 入门
  • 基于32QAM的载波同步和定时同步性能仿真,包括Costas环的gardner环
  • 日志收集Day001
  • 高效实现 Markdown 转 PDF 的跨平台指南20250117
  • Android 13 Hotseat定制化修改——001 hotseat布局方向
  • 【混合开发】CefSharp+Vue 解决Cookie问题
  • gitignore忽略已经提交过的