背景:分页请求接口数据,每页有最大请求条数限制。但前端需要一次性获取到全部数据,那么前端就需要循环调用接口,直到获取到全部的数据。
方法封装如下:
export const callMethodLimitPage = async (fn: Function, param: any, arr: any[] = [], pageIndex: number = 1): Promise<any> => {
let pageSizeMax = 100
if (param.pageSize && param.pageSize > 100) {
pageSizeMax = param.pageSize;
}
const { totalCount, data } = await fn({ ...param, pageIndex, pageSize: pageSizeMax });
const dataClone = data || [];
if (arr.length + pageSizeMax < totalCount) {
return callMethodLimitPage(fn, param, [...arr, ...dataClone], pageIndex + 1);
}
return new Promise((resolve) => {
resolve({
data: [...arr, ...dataClone].length ? [...arr, ...dataClone] : null,
errorCode: 0,
errorDesc: 'success',
totalCount: [...arr, ...dataClone].length,
});
});
};
参数说明:
参数一:service.js中抛出的接口请求方法。 (必填)
参数二:请求参数。(必填)
参数三:初始时的默认数据,如:全部选项 (非必填)
参数四:从第几页开始请求。(非必填)
(参数三、参数四 一般用不到)
使用:
const res = await callMethodLimitPage(inquire, params);