收藏
回答

skyline模式下 scroll-view 下拉刷新时频繁触发bindscrolltolower

框架类型 问题类型 终端类型 微信版本 基础库版本
小程序 Bug 微信iOS客户端 8.0.58 3.7.7

调试基础库版本:3.7.7

skyline模式下 scroll-view 下拉刷新时和刷新完成后都会触发bindscrolltolower事件,并且在scroll-view内无item时,上拉操作也会触发bindscrolltolower触底事件,导致列表界面同时带有下拉刷新和上拉加载功能会出现问题

代码如下:

js:

/**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onRefresh() {
    console.log("------------------下拉刷新--------------------")
    if (this.data.loading) {
      this.setData({
        refreshTrigger: false,
      })
      return
    }
    setTimeout(() => {
      
      var num = this.data.dataList.length + 1
      this.data.dataList.push(num)
      this.setData({
        refreshTrigger: false,
        dataList: this.data.dataList
      })
    }, 1500);
  },


  //上拉加载
  onLoadMore() {
    
    if (this.data.loading || this.data.refreshTrigger) {
      return
    }
    console.log("------------------加载更多--------------------")
    this.data.loading = true
    wx.showLoading({
      title: '加载中...',
    })
    setTimeout(() => {
      wx.stopPullDownRefresh()
      wx.hideLoading()
      this.data.loading = false


      var num = this.data.dataList.length + 1
      this.data.dataList.push(num)


      this.setData({
        dataList: this.data.dataList
      })
    }, 1500);
  },

wxss:

.scrollarea {
  flex1;
  overflow-y: hidden;
  background-color: yellow;
}
.item-conteiner {
  width100%;
  height86rpx;
  text-align: center;
  background-color: white;
}

wxml:

  <scroll-view class="scrollarea" scroll-y="true" refresher-enabled="true" refresher-threshold="{{100}}" refresher-triggered="{{refreshTrigger}}" bindrefresherrefresh="onRefresh" bindscrolltolower="onLoadMore" 
  refresher-background="#EDEDED" lower-threshold="1px">
    <block wx:for="{{dataList}}" wx:key="*this">
      <view class="item-conteiner">{{item}}</view>
    </block>
  </scroll-view>
回答关注问题邀请回答
收藏

1 个回答

  • 夏味
    夏味
    星期四 14:24

    bindscrolltolower 本来也会重复触发,需要自己业务上加个 loading 来阻止请求期间重复触发


    

    星期四 14:24
    有用
    回复
登录 后发表内容