useList 列表hook

代码示例

const { list, loading, pager, getList } = useList({
    request: () => axios.get('/api'),
    onSuccess: (data) => {
        // 处理数据
        // ...
        return data;
    },
});

参数

参数	说明	类型	默认值	是否必填
request	必填项，请求数据的函数	() => Promise<AxiosResponse<any>>	-	是
onSuccess	可选项，请求成功的回调函数	(data: any) => Record<string, any>[]	-	否
onError	可选项，请求失败的回调函数	(err: any) => void	-	否
onFinally	可选项，请求结束的回调函数	() => void	-	否
codeField	可选项，服务器状态码字段	string	code	否
dataField	可选项，服务器数据字段	string	data	否
useFetch	可选项，项目中自己重写的useFetch函数	(options: UseFetchOptions) => void	-	否

** UseListOptions 和 IList 类型定义**

type UseListOptions = {
    request: () => Promise<AxiosResponse<any>>;
    onSuccess?: (data: any) => Record<string, any>[];
    onError?: (err: any) => void;
    onFinally?: () => void;
    useFetch?: (options: UseFetchOptions) => void
    codeField?: string;
    dataField?: string;
}

interface IList {
    list: Ref<Record<string, any>[]>;
    loading: Ref<boolean>;
    pager: Ref<{
        page: number;
        size: number;
        total: number;
    }>,
    getList: () => void;
}

返回值

参数	说明	类型
list	列表数据	Ref<Record<string, any>[]>
loading	加载状态	Ref<boolean>
pager	分页信息	Ref<{page: number, size: number, total: number}>
getList	刷新列表	() => void