uni-app中tab触底更新交互

原创

于 2024-01-09 17:17:22 发布 · 379 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#uni-app

操作流程

根据高亮下标，获取对应列表数据
提取列表的分页参数，用于发送请求
滚动触底事件，页码累加，数组追加，退出判断等业务和常规分页基本一致
代码如下

参考代码

<script setup lang="ts">
let finish = ref(false)
// 滚动触底事件
let onScrolltolower = async () => {
   
   
  // 获取当前选项的下标
  let currentType = SubTypeList.value[activeIndex.value]
  /* 
  currentType.goodsItems.page 当前在第几页
  currentType.goodsItems.pages  总共多少页
   */
  if (currentType.goodsItems.page < currentType.goodsItems.pages) {
   
   
    // 当前页码累加
    currentType.goodsItems.page++
  } else {
   
   
    finish.value