微信小程序不调用“enablePullDownRefresh“实现上拉加载

1.调用scroll-view组件

<scroll-view  
scroll-y="true" 
style="height: 100vh;"  
refresher-enabled="true" 
refresher-default-style="black"
bindrefresherrefresh="onRefreshplay" 
refresher-triggered="{{isRefreshings}}" 
bind:scrolltolower="fetchWorkerListplay">
</scroll-view>

2.自定义下拉刷新被触发bindrefresherrefresh

  onRefreshplay(){
      this.data.pages = 1   //页数
      this.data.isRefreshings = false    //请求到数据结束刷新
      this.data.hasMores = true    //数据是否到底
      this.data.images = []        //请求的数据,这里是数组
      this.fetchWorkerListplay()   //调用请求的方法
    },

3.滚动到底部加载的事件bind:scrolltolower

 fetchWorkerListplay(){
      if (this.data.hasMores) {
        jobApi.waterYin({
          pageNum:this.data.pages,  
          pageSize:10, 
          recruitmentId:this.data.recruitmentId,
        })
            .then((data:any) => {
                this.data.pages++;
                this.data.images.push(...data.data);
                console.log(this.data)
                this.setData({
                    images: this.data.images,
                    isRefreshings: false
                })
                this.data.hasMores = (data.data.length >= 10)
            })
    } else {
        wx.showToast({ title: "没有更多数据", icon: "none" })
    }

注意:当有多重page数据需要加载的时候,一定要分开来写,否则会不断page++。

微信小程序scroll-view组件

第一次加载

 第二次加载

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值