ReferenceManyField 在 handleFetch TypeError 未捕获：payload.data.map 不是函数答案

【问题标题】：ReferenceManyField uncaught at handleFetch TypeError: payload.data.map is not a functionReferenceManyField 在 handleFetch TypeError 未捕获：payload.data.map 不是函数
【发布时间】：2018-06-04 07:45:45
【问题描述】：

我尝试以选项卡式 admin-on-rest 实现数据网格

我看到对 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"}]

在控制台我有错误：

未捕获的类型错误：无法读取未定义的属性“数据” 在 oneToMany.js:47

尝试回复：

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

拥有：

在 handleFetch TypeError 未捕获：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

反应版本：16.2.0

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

【问题讨论】：

标签： admin-on-rest

【解决方案1】：

包含指向本地开发服务器的链接没有帮助。

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

【讨论】：

正在删除本地链接，抱歉。我尝试了 JSON.parse() 并出现错误：位置 1 处 JSON 中的意外标记 o

【解决方案2】：

所以我发现问题需要检查您是否引用了在 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" />

现在运行良好

【讨论】：

这是一个好点。此资源向菜单添加一个新项目。你知道吗，我怎样才能不在菜单中显示并隐藏它？
您好，只是没有显示在菜单中。