import useSWRInfinite from "swr/infinite"; export type TResponseData = { data: D nextId?: string totalCount?: null | number pageIndex?: number pageSize?: number } export const createKey = (query: string, pageSize: number = 10, extra: Record = []) => { return (pageIndex: number, previousPageData) => { // pageIndex 后端要求是从 1 开始 if (pageIndex === 0) return [ query, { nextId: undefined, pageSize, pageIndex: pageIndex + 1 }, extra, ]; // 如果是以 pageIndex 作为分页依据 if (previousPageData && previousPageData.pageIndex && !previousPageData.nextId) { return [ query, { pageSize, pageIndex: previousPageData.pageIndex + 1 }, extra, ]; } console.log(previousPageData.nextId, 77779) if (previousPageData && previousPageData.nextId) { return [ query, { pageSize, nextId: previousPageData.nextId}, extra, ]; } return null; }; } export const useLoadMoreInfinite = (getKey, fetcher, params = {}) => { const { data, setSize, size, mutate, isLoading } = useSWRInfinite<{ data: T nextId?: string totalCount?: null | number pageIndex?: number pageSize?: number }>(getKey, fetcher, { ...params, revalidateIfStale: false, revalidateFirstPage: false, onErrorRetry(err, key, config, revalidate, revalidateOpts) { if (err.status === 404) return if (err.status === 401) return if (revalidateOpts.retryCount >= 3) return }, }); // 扁平化后的数据列表 const list = (data?.flatMap((page) => page?.data || []) || []) as T; // 原分页数据二维数组 const pages = data const pageIndex = size const loadMore = () => { setSize((size) => size + 1); } return { data, list, pageIndex, isLoading, pages, mutate, setSize, loadMore, } }