1

nx/hooks/usePageListData.js

@@ -0,0 +1,88 @@
+import { ref, reactive, onMounted, watch, unref } from 'vue'
+import { onReachBottom } from '@dcloudio/uni-app'
+
+export function useListData({ searchParams, api, needInitListData = false, processData }) {
+  // 定义响应式数据
+  const initListData = ref(needInitListData)
+  const loadingData = ref(true)
+  const pageParams = reactive({
+    pageNo: 1,
+    pageSize: 10,
+    order: 'desc',
+    column: 'createTime'
+  })
+  const total = ref(0)
+  const loadStatus = ref('loadmore')
+  const listData = ref([])
+
+  // 模拟获取数据的方法
+  const getListData = async () => {
+    const params = {
+      ...unref(searchParams),
+      ...pageParams
+    }
+    let { records, total: pageTotal } = await api(params)
+    total.value = pageTotal
+    if (processData) {
+      records = processData(records)
+    }
+    return records
+  }
+
+  // 页面底部触底加载更多
+  const scrollToLower = async () => {
+    if (listData.value.length >= total.value) {
+      loadStatus.value = 'nomore'
+      return
+    } else {
+      loadStatus.value = 'loading'
+    }
+    pageParams.pageNo++
+    await loadMore()
+  }
+
+  // 加载更多数据
+  const loadMore = async () => {
+    const newData = await getListData()
+    listData.value = [...listData.value, ...newData]
+    if (listData.value.length >= total.value) loadStatus.value = 'nomore'
+  }
+  // 初始化数据
+  const getInitData = async () => {
+    loadStatus.value = 'loadmore'
+    pageParams.pageNo = 1
+    total.value = 0
+    listData.value = []
+    loadingData.value = true
+    let data = await getListData().finally(() => {
+      loadingData.value = false
+    })
+    listData.value = data
+    if (listData.value.length >= total.value) loadStatus.value = 'nomore'
+  }
+
+  // 组件挂载时执行初始化
+  onMounted(() => {
+    if (initListData.value) {
+      getInitData()
+    }
+  })
+  onReachBottom(() => {
+    scrollToLower()
+  })
+
+  // 监听滚动到底部事件
+  // 注意：在实际应用中，你需要根据你的框架或库来监听滚动到底部的事件
+
+  return {
+    initListData,
+    loadingData,
+    pageParams,
+    total,
+    loadStatus,
+    listData,
+    loadMore,
+    scrollToLower,
+    getInitData
+  }
+}