小程序scroll-view自适应高度和下拉刷新

wepy框架小程序开发

开发小程序的可能都会遇到一个问题在某些场景或产品的要求下scroll-view做上拉加载或下拉刷新且能根据屏幕大小自适应高度

//wxml
 <scroll-view style="height:{{scrollHeight||1000}}rpx"
 //这里因为下拉刷新这个scrollHeight必须给个默认值否则下拉刷新方法会出问题
                         scroll-y="true"
                         @scrolltolower="scrolltolower"
                         //这个写的上拉加载到底触发
                         refresher-triggered='{{refreshertriggered}}'
                         //是否隐藏下拉刷新
                         @refresherrefresh='refresherrefresh'
                         //下拉刷新的方法
                         refresher-enabled>
                         
   <scroll-view>
  //wxss
  onLoad(){
  
  	  let windowHeight = wx.getSystemInfoSync().windowHeight // 屏幕的高度
     let windowWidth = wx.getSystemInfoSync().windowWidth // 屏幕的宽度
     //那么这里拿到了当前设备屏幕的高度和宽度剩下的就简单了
     //scrollHeight 为当前scroll-view的高度
      this.scrollHeight = windowHeight * 750 / windowWidth - 437
      （这里减号为当前你除去scroll-view的其他盒子的高度）
      //这里的要根据自己需要的scroll-view的高度调试
     this.$apply()
      
  }