上拉刷新下拉加载

yiming

2024-03-22 230c0da617bed5093b3b2832d9b53962bb5c6781

上拉刷新下拉加载

 pages/bibliographyList/index.js

@@ -7,6 +7,7 @@
     * 页面的初始数据
     */
    data: {
      isMore: null,
      higherList: [],
      vocationalList: [],
      teacherList: [],
@@ -16,7 +17,8 @@
      value: '',
      BarHeight: '',
      navBarHeight: '',
 
      start: 1,
      tabValue: ''
    },

    /**
@@ -35,7 +37,12 @@
        barHeight: systInfo.statusBarHeight,
      })

      let event =
      {
        detail: { value: "0" }
      }

      this.onTabsChange(event)



@@ -92,12 +99,28 @@

    },
    onTabsChange(event) {
      console.log(`Change tab, tab-panel value is ${event.detail.value}.`);

      const value = event.detail.value

      if (value === '0') {
        console.log(value);
        this.setData({
          tabValue: value
        })
      } else if (value === '1') {
        console.log(value);
        this.setData({
          tabValue: value
        })
      } else if (value === '2') {
        console.log(value);
        this.setData({
          tabValue: value
        })
      }
    },

    onTabsClick(event) {
      console.log(`Click tab, tab-panel value is ${event.detail.value}.`);
    },

    //高等教育
    higherGet(keyword) {
      let searchObj = {
@@ -112,7 +135,7 @@
        queryType: '*',
        paging: {
          start: '0',
          size: '999'
          size: this.data.start * 9
        },
        coverSize: {
          width: 260
@@ -139,7 +162,7 @@
        })
        console.log(this.data.higherList, '5555');
      })

      wx.stopPullDownRefresh()

    },

@@ -156,7 +179,7 @@
        queryType: '*',
        paging: {
          start: '0',
          size: '999'
          size: this.data.start * 9
        },
        coverSize: {
          width: 260
@@ -181,6 +204,7 @@
        })

      })
      wx.stopPullDownRefresh()
    },
    // 职业教育
    teacherGet(keyword) {
@@ -195,7 +219,7 @@
        queryType: '*',
        paging: {
          start: '0',
          size: '999'
          size: this.data.start * 9
        },
        coverSize: {
          width: 260
@@ -220,7 +244,7 @@
        })

      })

      wx.stopPullDownRefresh()

    },
    downloadData(event) {
@@ -267,5 +291,82 @@
    goBack() {
      wx.navigateBack();
    },
    onReachBottom(e) {
      if (this.data.tabValue == 0) {
        console.log(0);
        if (this.data.higherList.length < this.data.higherTotal) {
          this.setData({
            isMore: true,
            start: this.data.start + 1
          })
          this.higherGet()
        } else {
          this.setData({
            isMore: true,
          })
          setTimeout(() => {
            this.setData({
              isMore: false
            })
          }, 100)

        }

      } else if (this.data.tabValue == 1) {

        if (this.data.teacherList.length < this.data.teacherTotal) {
          this.setData({
            isMore: true,
            start: this.data.start + 1
          })
          this.teacherGet()
        } else {
          this.setData({
            isMore: true,
          })
          setTimeout(() => {
            this.setData({
              isMore: false
            })
          }, 100)

        }
        console.log(2);
      } else if (this.data.tabValue == 2) {

        if (this.data.vocationalList.length < this.data.vocationalTotal && this.data.vocationalList.length > 9) {
          this.setData({
            isMore: true,
            start: this.data.start + 1
          })
          this.vocationalGet()
        } else {
          this.setData({
            isMore: true,
          })
          setTimeout(() => {
            this.setData({
              isMore: false
            })
          }, 100)

        }
        console.log(2);
      }



    },
    onPullDownRefresh() {


      this.setData({
        start: 1
      })
      this.vocationalGet()
      this.higherGet()
      this.teacherGet()

    },

  })

 pages/bibliographyList/index.json

@@ -4,7 +4,12 @@
    "t-tabs": "tdesign-miniprogram/tabs/tabs",
    "t-tab-panel": "tdesign-miniprogram/tab-panel/tab-panel",
    "t-search": "tdesign-miniprogram/search/search",
    "t-icon": "tdesign-miniprogram/icon/icon"
    "t-icon": "tdesign-miniprogram/icon/icon",
    "t-loading": "tdesign-miniprogram/loading/loading",
    "t-image": "tdesign-miniprogram/image/image"
  },
  "navigationStyle": "custom"
  "navigationStyle": "custom",
  "enablePullDownRefresh": true,
  "onReachBottomDistance": 200,
  "backgroundTextStyle": "dark"
}

 pages/bibliographyList/index.wxml

@@ -49,7 +49,10 @@
      </view>

    </view>

    <view class="bottom-box">
      <t-loading theme="circular" size="40rpx" class="wrapper" wx:if="{{isMore == true}}" />
      <text wx:if="{{isMore == false}}">没有更多了</text>
    </view>
  </t-tab-panel>
  <t-tab-panel label="职业教育({{vocationalTotal}})" value="1">
    <view class="outsideHigherBox">
@@ -67,7 +70,10 @@
      </view>

    </view>

    <view class="bottom-box">
      <t-loading theme="circular" size="40rpx" class="wrapper" wx:if="{{isMore == true}}" />
      <text wx:if="{{isMore == false}}">没有更多了</text>
    </view>

  </t-tab-panel>
  <t-tab-panel label="教师教育({{teacherTotal}})" value="2">
@@ -86,6 +92,10 @@
      </view>

    </view>
    <view class="bottom-box">
      <t-loading theme="circular" size="40rpx" class="wrapper" wx:if="{{isMore == true}}" />
      <text wx:if="{{isMore == false}}">没有更多了</text>
    </view>
  </t-tab-panel>

</t-tabs>

 pages/bibliographyList/index.wxss

@@ -119,4 +119,13 @@

.t-tabs__track {
  background-color: #FF6C00 !important;
}

.bottom-box {
  display: flex;
  justify-content: center;
  color: #999;
  height: 80rpx;
  font-size: 28rpx;
  --td-loading-color: #ff6c00
}

 pages/cart/index.js

@@ -11,10 +11,14 @@
    checkedList: [],
    selectedCount: 0,
    totalPrice: 0.00,
    type: ''
    type: '',
    start: 1,
    totalSize: '',
    isMore: null,
  },

  onLoad(options) {

    wx.setNavigationBarTitle({
      title: '购物车'
    });
@@ -38,16 +42,19 @@
  shoppingCartGet() {
    let query = {
      start: 0,
      size: 999,
      size: this.data.start * 4,
      filterList: [],
      searchList: []
    };
    app.MG.store.getShoppingCartProductList(query).then(res => {
      console.log(res, 'res');

      this.setData({
        totalSize: res.totalSize
      })

      res.datas.forEach(item => {
        item.imgUrl = getPublicImage(item.productMonWithLinkDto.product.icon, '', '160');
        console.log(item);
        console.log(item.saleMethod.type, 'item.saleMethod.type')

        this.setData({
          type: item.saleMethod.type == 'createProductItemSaleMethod' ? 'item' : 'product'
        })
@@ -58,6 +65,7 @@
        shoppingCartData: res.datas
      });
    });
    wx.stopPullDownRefresh()
  },

  bottomChange(e) {
@@ -134,5 +142,35 @@
    wx.navigateTo({
      url: '/pages/testLogin/index'
    });
  }
  },
  //触底函数
  onReachBottom() {
    if (this.data.shoppingCartData.length < this.data.totalSize) {
      this.setData({
        isMore: true,
        start: this.data.start + 1
      })
      this.shoppingCartGet()
    } else {
      this.setData({
        isMore: true,
      })
      setTimeout(() => {
        this.setData({
          isMore: false
        })
      }, 100)

    }
  },
  // 下拉函数
  onPullDownRefresh() {

    this.setData({
      start: 1
    })
    console.log(978);
    this.shoppingCartGet()
  },

});

 pages/cart/index.json

@@ -6,6 +6,11 @@
    "t-cell": "tdesign-miniprogram/cell/cell",
    "t-button": "tdesign-miniprogram/button/button",
    "t-toast": "tdesign-miniprogram/toast/toast",
    "t-empty": "tdesign-miniprogram/empty/empty"
  }
    "t-empty": "tdesign-miniprogram/empty/empty",
    "t-loading": "tdesign-miniprogram/loading/loading",
    "t-image": "tdesign-miniprogram/image/image"
  },
  "enablePullDownRefresh": true,
  "onReachBottomDistance": 200,
  "backgroundTextStyle": "dark"
}

 pages/cart/index.wxml

@@ -46,7 +46,10 @@
    </view>
    <view slot="right" class="btn delete-btn" bind:tap="onDelete" data-item="{{item}}">删除</view>
  </t-swipe-cell>

  <view class="bottom-box">
    <t-loading theme="circular" size="40rpx" class="wrapper" wx:if="{{isMore == true}}" />
    <text wx:if="{{isMore == false}}">没有更多了</text>
  </view>
</view>

<view class="bottomBox">

 pages/cart/index.wxss

@@ -249,4 +249,13 @@
  color: #333333;
  /* margin: 10rpx 0; */
  margin-bottom: 20rpx;
}

.bottom-box {
  display: flex;
  justify-content: center;
  color: #999;
  height: 80rpx;
  font-size: 28rpx;
  --td-loading-color: #ff6c00
}

 pages/retrievalPage/index.js

@@ -41,7 +41,6 @@
    const menu = wx.getMenuButtonBoundingClientRect(); // 胶囊信息
    const navBarHeight = (menu.top - systInfo.statusBarHeight) * 2 + menu.height; // 导航栏高度
    this.setData({

      navBarHeight: navBarHeight,
      barHeight: systInfo.statusBarHeight,
      searchVal: options.searchVal
@@ -492,7 +491,7 @@


    })

    wx.stopPullDownRefresh()
  },
  bibliographyGet() {
    let bibliographyObj = {}
@@ -533,6 +532,7 @@
      })

    })
    wx.stopPullDownRefresh()
  },
  downloadData(event) {
    console.log(111);
@@ -585,10 +585,7 @@
      url: '/pages/bookExhibitionDetails/index?id=' + item.id + '&bookName=' + item.name // 假设跳转到详情页面，并传递了id参数
    });
  },
  //触底函数
  onReachBottom() {
    console.log("上拉加载....");
  },

  //上拉函数
  onPullDownRefresh() {
    console.log("下拉刷新...");
@@ -717,5 +714,22 @@

  },

  // 下拉函数
  onPullDownRefresh() {

    if (this.data.tabValue == 4) {
      this.setData({
        "pageCount.page": 1
      })
      this.bibliographyGet()
    } else {
      this.setData({
        "pageCount.page": 1
      })
      this.retrievalPageGet()
    }



  },
})

 pages/retrievalPage/index.json

@@ -12,5 +12,6 @@
  },
  "navigationStyle": "custom",
  "enablePullDownRefresh": true,
  "onReachBottomDistance": 200
  "onReachBottomDistance": 200,
  "backgroundTextStyle": "dark"
}