reachBottom.js 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. module.exports = Behavior({
  2. data: {
  3. loading: false, // 加载状态标志位
  4. list: [],
  5. grade: '',
  6. pageNo: 1,
  7. totalSize: 0,
  8. noMoreData: false, // 无更多数据置为 false
  9. },
  10. methods: {
  11. async getData(fn, args) {
  12. if (this.data.noMoreData) {
  13. return
  14. }
  15. let params = {
  16. pageNo: this.data.pageNo,
  17. pageSize: 10,
  18. ...args
  19. }
  20. // 加载状态,用于页面中控制加载动画的显示
  21. this.setData({
  22. loading: true
  23. })
  24. let {
  25. list,
  26. totalSize
  27. } = await fn(params).finally(() => {
  28. // 页面渲染完成后关闭加载动画字段
  29. wx.nextTick(() => {
  30. this.setData({
  31. loading: false
  32. })
  33. });
  34. })
  35. list = [...this.data.list, ...list]
  36. console.log(list,
  37. totalSize);
  38. this.setData({
  39. pageNo: ++this.data.pageNo,
  40. list,
  41. totalSize,
  42. noMoreData: list.length >= totalSize
  43. })
  44. },
  45. resetData(data) {
  46. if (this.data.loading) return; // 如果接口已经在请求中,则不重置数据,防止用户持续下拉刷新
  47. this.setData({
  48. loading: false,
  49. list: [],
  50. pageNo: 1,
  51. totalSize: 0,
  52. noMoreData: false,
  53. })
  54. this.loadMore(data); // 调用页面中的接口请求方法
  55. },
  56. },
  57. })