import { ref, unref, onMounted, computed } from "vue"; import { chatApi } from '@/api/chat'; export const useInfinite = (path, props) => { const pageParams = ref({ pageNum: 1, pageSize: 20 }); const queryParams = ref(props); const recordList = ref([]); const isFetching = ref(false); const counter = ref(0); const noMore = ref(false); // let isSwitchStatus = false; const isMore = computed(() => pageParams.value.pageNum * pageParams.value.pageSize < counter.value); const addHistoryRecord = record => { recordList.value.unshift(...record); } const onScrolltolower = async () => { if(unref(isFetching) || unref(noMore) ) return; isFetching.value = true; const { rows, total } = await initRecordData(); recordList.value.push(...rows); counter.value = total; if (unref(isMore)) { pageParams.value.pageNum ++; } else { noMore.value = true; } isFetching.value = false; } const onReset = async () => { const { rows, total } = await initRecordData({pageNum:1, pageSize: (pageParams.value.pageNum * pageParams.value.pageSize) + 1}); recordList.value = rows; counter.value = total; noMore.value = !unref(isMore) } // 重置请求 const onRestore = async (params) => { pageParams.value = { pageNum: 1, pageSize: 20 }; queryParams.value = { ...unref(queryParams), ...params }; const { rows, total } = await initRecordData(); // isSwitchStatus = true; recordList.value = rows; counter.value = total; // setTimeout(() => isSwitchStatus = false, 100); noMore.value = !isMore.value; } const initRecordData = async (params = {}) => { const reqParams = { ...unref(pageParams), ...unref(queryParams), ...params } return await chatApi.getRecordFetch(path, reqParams); } onMounted(() => onScrolltolower()); return { recordList, isFetching, onScrolltolower, onReset, onRestore, addHistoryRecord } }