小程序中的分页加载

最新推荐文章于 2023-04-30 10:42:52 发布

Mr.Leer

最新推荐文章于 2023-04-30 10:42:52 发布

阅读量681

点赞数 1

文章标签：小程序微信小程序 javascript

本文链接：https://blog.csdn.net/qq_43498860/article/details/122215747

版权

本文介绍了微信小程序中实现分页加载的方法，通过定义数据和处理触底事件，实现内容的逐页加载。

摘要由CSDN通过智能技术生成

话不多说，直接上代码

定义数据

  data: {
    currentPage: 1,
    pageSize: 10,
  }

在事件函数中处理

  getWaterLogList() {
    let { currentPage,pageSize } = this.data
    let query = { currentPage, pageSize }
    app.request('接口', query, res => {
      let list = res.list;
        // 页码为1，返回数据长度为0
      if (currentPage == 1 && list.length == 0) {
        wx.showToast({
          title: '暂无数据',
          icon:'none'
        });
        return;
      }
        // 页码大于1，返回数据长度为0
      if (currentPage > 1 && list.length == 0) {
        wx.showToast({
          title: '没有更多数据了!',
          icon:'none'
        });
        return;
      }
       // 页码大于1，拼接返回的数据
      if (currentPage > 1) {
        this.setData({
          list: this.data.