react-admin：错误：dataProvider抛出错误。它应该返回一个被拒绝的Promise-简单的解决方法？

Question

在编辑表单中，我需要显示其他资源中的相关记录（作业记录列表）。该关系有点怪异，需要字符串解析，所以我不能只使用内置的ReferenceField。这就是为什么我试图使用getList钩子调用dataProvider的useGetList函数。不幸的是，我在表单渲染时遇到错误：

dataProvider抛出错误。它应该返回一个被拒绝的承诺代替

这是我的自定义数据提供程序的getList函数：

 getList: (resource, params) => {
        console.log('DataProvider.GetList ');
        console.log(resource);
        console.log(params);
        const { page, perPage } = params.pagination;
        const { field, order } = params.sort;
        const query = {
            ...fetchUtils.flattenObject(params.filter),
            _sort: field,
            _order: order,
            _start: (page - 1) * perPage,
            _end: page * perPage,
        };
        const url = `${getUrl(resource)}?${stringify(query)}`;
        const paging = supportsPaging(resource);

        return httpClient(url).then(
            ({ headers, json }) => {
                var result = [];

                // Implementierung von clientseitigem Paging & Filtering
                var filtered = applyFilter(json, params.filter);
                if (!paging) {
                    filtered=applyPagination(filtered, page, perPage);
                }
                else {
                    result = filtered;
                }

                return {
                    data: result,
                    total: json.length 
                };
            }, ({ reason }) => {

                console.log(reason);
            }).catch((e)=>{
                console.log(e);
            });
    }

我在编辑表单中使用此自定义组件。

export const CSEJobList = ({ ...props }) => {
    const form = useForm();
    var formdata = form.getState().values;
    console.log("CSEJobList");
    if (formdata && formdata.status && formdata.status.id >= 2) {
        var data = GetJobData({ 'filter': { type: 'abeitsschein_id_' + formdata.id } });
        return data;
    }
    else {
        return <div>Test</div>
    }
};
CSEJobList.defaultProps = { label: 'Arbeitsschein', addLabel: true };

  const GetJobData = (params) => {
        let parms = { "pagination": { "page": 0, "perPage": 25 }, "sort": { "field": "id", "order": "ASC" }, "filter": {} };
        const { data, loading, error } = useGetList('jobs', parms);
        if (loading) { return <LinearProgress />; }
        if (error) { return <p>ERROR</p>; }
        return <p>{data}</p>;
    };

这只是基本测试。由于调用会导致上述错误，因此尚未正确显示结果数据。

我阅读了很多有关查询API的文档（https://marmelab.com/react-admin/Actions.html#specialized-hooks），但摆弄很多，但由于对Promise的了解有限，所以我失败了。

有简单的解决方法吗？

更新：

我像这样更改了dataProvider getList函数，按建议返回被拒绝的承诺：

getList: (resource, params) => {
    console.log('DataProvider.GetList ');
    console.log(resource);
    console.log(params);
    const { page, perPage } = params.pagination;
    const { field, order } = params.sort;
    const query = {
        ...fetchUtils.flattenObject(params.filter),
        _sort: field,
        _order: order,
        _start: (page - 1) * perPage,
        _end: page * perPage,
    };
    const url = `${getUrl(resource)}?${stringify(query)}`;
    const paging = supportsPaging(resource);

    return httpClient(url).then(
        ({ headers, json }) => {
            var result = [];

            // Implementierung von clientseitigem Paging & Filtering
            var filtered = applyFilter(json, params.filter);
            if (!paging) {
                filtered=applyPagination(filtered, page, perPage);
            }
            else {
                result = filtered;
            }

            return {
                data: result,
                total: json.length,  // Erfordert nun keinen speziellen Header mehr, CSE-Connect kompatibel
            };
        }, ({ reason }) => {
            return Promise.reject(reason);
        }).catch((e)=>{
            console.log(e);
            return Promise.reject(e);
        });
},

没有效果。经过一些调试后，我意识到在GetJobData函数中，该行

if (loading) { return <LinearProgress />; }

导致错误。代码的其他部分完全相同，因此可疑者不是LinearProgress。我实际上不知道是什么原因导致了错误。由于超时，调试很难甚至不可能。

Answer 1

如果发生错误，您的dataProvider应该返回以下值：

import { HttpError } from 'react-admin'
...
return Promise.reject(new HttpError(message, status, body))