小程序——下拉加载列表例子

我所使用的是钉钉的小程序 微信或者其他的小程序也能安装这个思路来替换官方提供的api就行
hrml

<view>
  <view class="myscroll-wrap">
    <view class="item" a:for="{{list}}">{{index+1}} 第{{pageIndex}}页</view>
    <view class="loading" a:if="{{loading}}">正在加载中...</view>
  </view>
</view>

js

 data: {
    list:[], // 列表数据
    pageIndex: 0, //页码
    pageNum: 10,  //每页多少条
    totalPage: 5, //总页数
    loading: false, // 加载动画
  },
    onLoad() {
    this.getdata();
  },
  onReachBottom() {
    // 页面被拉到底部
    console.log('页面被拉到底部: ');
    console.log(this.data.pageIndex);
    if(this.data.pageIndex > this.data.totalPage){
      console.log('加载完毕');
      this.setData({loading: false});
      return
    }
    this.getdata();
  },
  async getdata(pageIndex){
    if(this.data.isPullDownRefresh){
      this.setData({
        pageIndex: 1,
        list: []
      }) 
    }
    console.log('获取数据: ');
    console.log('this.data.pageIndex: ', this.data.pageIndex);
    this.setData({loading: true});
    let list = this.data.list;
    for(let i=1; i<11;i++){
      list.push(i);
    }
    setTimeout(() => {
      this.setData({
        list,
        pageIndex: (this.data.pageIndex)+1,
        loading: false,
        isPullDownRefresh: false
      })  
      my.stopPullDownRefresh()
    }, 3000);
  }