reader/mixins/reachBottom.js

module.exports = Behavior({
  data: {
    loading: false, // 加载状态标志位
    list: [],
    nullList: false,
    grade: '',
    pageNo: 1,
    totalSize: 0,
    noMoreData: false, // 无更多数据置为 false
    mainList: [] //前端分页的大数组
  },
  methods: {
    async getData(fn, args) {
      if (this.data.noMoreData) {
        return
      }
      let params = {
        pageNo: this.data.pageNo,
        pageSize: 10,
        ...args
      }
      // 加载状态，用于页面中控制加载动画的显示
      this.setData({
        loading: true,
        nullList: false
      })
      let {
        list,
        totalSize
      } = await fn(params).finally(() => {
        // 页面渲染完成后关闭加载动画字段
        wx.nextTick(() => {
          this.setData({
            loading: false
          })
        });
      })
      list = [...this.data.list, ...list]
      this.setData({
        nullList: list.length == 0
      })
      this.setData({
        pageNo: ++this.data.pageNo,
        list,
        totalSize,
        noMoreData: list.length >= totalSize
      })
    },
    // 前端分页
    async localGetData(fn, args) {
      let mainList = this.data.mainList
      let list = this.data.list
      let params = {
        pageNo: this.data.pageNo,
        pageSize: 100,
        ...args
      }
      if (mainList.length == 0) {
        // 加载状态，用于页面中控制加载动画的显示
        this.setData({
          loading: true,
          nullList: false
        })
        let res = await fn(params).finally(() => {
          // 页面渲染完成后关闭加载动画字段
          wx.nextTick(() => {
            this.setData({
              loading: false
            })
          });
        })
        mainList = res.list
        list = mainList.slice(0, this.data.pageNo * 6)
        if (list.length == 0) {
          this.setData({
            nullList: true
          })
        } else {
          this.setData({
            nullList: false
          })
        }
        this.setData({
          pageNo: ++this.data.pageNo,
          mainList,
          list,
        })
      } else if (mainList.length != 0 && mainList.length > list.length) {
        list = this.data.mainList.slice(0, this.data.pageNo * 6)
        this.setData({
          pageNo: ++this.data.pageNo,
          mainList,
          list,
        })
      }
    },
    resetData(data) {
      if (this.data.loading) return; // 如果接口已经在请求中，则不重置数据，防止用户持续下拉刷新
      this.setData({
        loading: false,
        list: [],
        mainList: [],
        pageNo: 1,
        totalSize: 0,
        noMoreData: false,
      })
      this.loadMore(data); // 调用页面中的接口请求方法
    },
  },
})