scroll-view高度计算

最新推荐文章于 2025-03-18 20:23:38 发布

ঞ᭄阿້໌ᮩ莲໌້ᮨꦿ

最新推荐文章于 2025-03-18 20:23:38 发布

阅读量456

点赞数

分类专栏：微信小程序

本文链接：https://blog.youkuaiyun.com/qq_41241504/article/details/116159246

版权

微信小程序屏幕适配滚动视图布局计算动态高度

关键词由优快云通过智能技术生成

微信小程序专栏收录该内容

94 篇文章

订阅专栏

这篇博客探讨了如何在微信小程序中利用onLoad函数获取屏幕尺寸，并动态计算<scroll-view>组件的滚动高度，以实现自适应屏幕比例的布局。作者通过设置scroll-height样式属性，确保内容区域在不同设备上都能正确填充屏幕，避免了内容显示不全的问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<scroll-view scroll-y="{true}" style="height:{{scroll_height}}rpx"></scroll-view>

  onLoad: function (options) {
    let windowHeight = wx.getSystemInfoSync().windowHeight // 屏幕的高度
    let windowWidth = wx.getSystemInfoSync().windowWidth // 屏幕的宽度
    this.setData({
      scroll_height: windowHeight * 750 / windowWidth - 140,
    })
  },