Question

我尝试以标签形式admin-on-rest

实现datagrid

我看到对api的请求看起来不错：

/api/v1/projectRounds?_end=25&_order=DESC&_sort=id&_start=0&projectId=505

如果我尝试回复：

[{"id":13,"projectId":505,"createdAt":"2017-11-17T00:24:34.000Z"}]

在控制台中我有错误：

未捕获的TypeError：无法读取未定义的属性“数据” 在oneToMany.js：47

尝试回复：

{"data":[{"id":13,"projectId":505,"createdAt":"2017-11-17T00:24:34.000Z"}],"total":1}

有：

未处理handleFetch类型错误：payload.data.map不是函数在./node_modules/admin-on-rest/lib/reducer/admin/references/oneToMany.js.exports.default

我从admin-on-rest示例中提供代码： https://github.com/marmelab/admin-on-rest-demo/blob/a67978a6f69e7dfbb937f66baaa49e787e5853ec/src/visitors/index.js#L82-L93

我的代码如下：

<FormTab label="Project rounds">
    <ReferenceManyField reference="projectRounds" target="projectId" addLabel={false}>
        <Datagrid>
            <TextField source="id" />
        </Datagrid>
     </ReferenceManyField>
 </FormTab>

休息客户：

const httpClient = (url, options = {}) => {
    if (!options.headers) {
        options.headers = new Headers({ Accept: 'application/json' });
    }
    const token = localStorage.getItem('token');
    options.headers.set('Authorization', `${token}`);
    return fetchUtils.fetchJson(url, options);
}

const restClient = jsonServerRestClient(process.env.REACT_APP_API_URL, httpClient);
const App = () => (
    <Admin restClient={restClient} authClient={authClient}>
        <Resource name="projects" list={ProjectList} edit={ProjectEdit} create={ProjectCreate} />
        <Resource name="monitors" list={MonitorList} icon={MonitorIcon}/>
    </Admin>
);

环境：

Admin-on-rest版本：1.3.3

React版本：16.2.0

你能帮我正确的api响应或配置REST客户端吗？

Answer 1

所以我发现问题需要检查是否引用了src / App.js中的资源添加的请求：

const App = () => (
    <Admin restClient={jsonServerRestClient('http://jsonplaceholder.typicode.com')}>
        <Resource name="posts" list={PostList} create={PostCreate} edit={PostEdit} show={PostShow} remove={Delete} icon={PostIcon} />
        <Resource name="users" list={UserList} />
        <Resource name="comments" list={CommentList} create={CommentCreate} edit={CommentEdit} remove={Delete} icon={CommentIcon} />
        <Resource name="projectRounds" />
    </Admin>
);

就像我这样的例子

<Resource name="projectRounds" />

现在运作良好

Answer 2

包含指向本地开发服务器的链接无济于事。

您是否尝试在映射之前对有效负载数据运行JSON.parse（）？

ReferenceManyField未处理handleFetch TypeError：payload.data.map不是函数

2 个答案: