微信小程序上拉加载更多和下拉刷新

// pages/goods_list/goods_list.js
import { getGoodsList } from '../../network/http.js';
Page({
  /**
   * 页面的初始数据
   */
  data: {
    cid: '',//商品传递过来的id参数
    goodsList: [], //商品列表
  },
  QueryParams: {
    cid: '',
    pagenum: 1, //页码
    pagesize: 5, //每页数量
  },
  totalPages: 1,

  // 获取商品列表
  async getGoodsList() {
    const res = await getGoodsList(this.QueryParams);//网络请求参数
    const goodsList = res.data.message.goods;//获取商品列表
    const total = res.data.message.total; //获取总的商品数
    //使用Math.ceil天花板函数进行计算总页数，如2.5会取整为3
    this.totalPages = Math.ceil(
      total / this.QueryParams.pagesize
    ); //计算总页数，（总商品数/每页容量），向上取整，得到页数
    this.setData({
      goodsList: [...this.data.goodsList, ...goodsList],//对上一页数据和新请求的数据，进行数组拼接
    });
    //关闭下拉刷新
    wx.stopPullDownRefresh();
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.QueryParams.cid = options.cid;
    this.getGoodsList();
  },
  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    if (this.QueryParams.pagenum >= this.totalPages) {
    //如果当前页数大于等于总页数
    //wx-showToast，按tab生成，粗底后的提示框
      wx.showToast({
        title: '我是有底线的',
        icon: 'none',
        image: '',
        duration: 1500,
        mask: false,
        success: (result) => {},
        fail: () => {},
        complete: () => {},
      });
    } else {
    //当前页数还没有到最后一页
      this.QueryParams.pagenum++;
      this.getGoodsList();
      console.log('还有下一页');
    }
  },

  onPullDownRefresh: function () {
    console.log('你下拉了');
    //重置数组
    this.setData({
      goodsList: [],
    });
    this.QueryParams.pagenum = 1; //将页面改为默认1
    this.getGoodsList(); //重新请求数据
  },

});

export default {
    name: "Category",
    data() {
        return {
            currentIndex: 0,
            clubSN: null,
            Code: null,
            proName: "",
            codeLevel1: "",
            sortData: [], //一级分类数据
            secondSordData: [], //二级分类数据
            pageSize: 10, //每页数量
            pageIndex: 1, //页面
            totalPages: 1 //总页数
        };
    },
    created() {
        this.requestData();
    },
    methods: {
        /* 点击一级分类 */
        async oneSortClick(oneSortData) {
            this.getTwoSortData();  //请求二级分类数据
        },
        /* 获取二级分类数据 */
        async getTwoSortData() {
            let res = await getTwoSortData({
                codeLevel1: this.codeLevel1,
                pageIndex: this.pageIndex,
                pageSize: this.pageSize,
                clubSN: this.clubSN
            });
            let total = res.toTal;  //获取总数量
            this.totalPages = Math.ceil(total / this.pageSize);  //计算页数
            this.secondSordData = [...this.secondSordData, ...res.data];  //商品数据拼接
        },
        /* 加载更多 */
        loadMore() {
        //判断当前页数是否大于等于总页数
            if (this.pageIndex >= this.totalPages) {
                console.log("我是有底线的");
            } else {
                this.pageIndex++;  //页数加1
                this.getTwoSortData(); //请求新数据
            }
        }
    }
};

//简化版本
export default {
    data() {
        return {
            pageSize: 10, //每页数量
            pageIndex: 1, //页面
            totalPages: 1 //总页数
        };
    },
    created() {
        this.requestData();
    },
    methods: {
        /* 获取二级分类数据 */
        async getTwoSortData() {
            let res = await getTwoSortData({});//网络请求
            let total = res.toTal;  //获取总数量
            this.totalPages = Math.ceil(total / this.pageSize);  //计算页数
            this.secondSordData = [...this.secondSordData, ...res.data];  //商品数据拼接
        },
        /* 加载更多 */
        loadMore() {
        //判断当前页数是否大于等于总页数
            if (this.pageIndex >= this.totalPages) {
                console.log("我是有底线的");
            } else {
                this.pageIndex++;  //页数加1
                this.getTwoSortData(); //请求新数据
            }
        }
    }
}

微信小程序

data() {
	return {
		toTalPage: 0, //总页数
		//请求商品数据的入参
		goodsParams: {
			pageSize: 2,
			pageIndex: 1,
		},
	};
}

onShow() {
	//切换回页面之后，对已经加载过的数据进行更新
	for (let i = 0; i < pageIndex; i++) {
		this.goodsParams.pageIndex = i + 1;
		this.getActGood();
	}
}

methods:{
	//获取活动商品信息
	async getActGood() {
		let { data, toTalPage } = await GetSpecialAreaAuditListSuccess(this.goodsParams);

		this.toTalPage = toTalPage;

		this.productData = this.delObj([...this.productData, ...data]);

		if (this.goodsParams.pageIndex == this.toTalPage) {
			this.showText = true;
		} else {
			this.showText = false;
		}
	},
	//去除数组中重复的对象
	delObj(obj) {
		var uniques = [];
		var stringify = {};
		for (var i = 0; i < obj.length; i++) {
			var keys = Object.keys(obj[i]);
			keys.sort(function (a, b) {
				return Number(a) - Number(b);
			});
			var str = '';
			for (var j = 0; j < keys.length; j++) {
				str += JSON.stringify(keys[j]);
				str += JSON.stringify(obj[i][keys[j]]);
			}
			if (!stringify.hasOwnProperty(str)) {
				uniques.push(obj[i]);
				stringify[str] = true;
			}
		}
		uniques = uniques;
		return uniques;
	},
};

onReachBottom() {
	if (this.goodsParams.pageIndex < this.toTalPage) {
		this.goodsParams.pageIndex++;
		this.getActGood();
	}
}