'GET_LIST' 的响应必须像 { data : [...] }，但接收到的数据不是数组答案

【问题标题】：The response to 'GET_LIST' must be like { data : [...] }, but the received data is not an array'GET_LIST' 的响应必须像 { data : [...] }，但接收到的数据不是数组
【发布时间】：2019-12-09 08:38:45
【问题描述】：

我正在尝试使用ra-data-simple-rest data provider。

import React from 'react';
import { Admin, fetchUtils, Resource } from 'react-admin';
import simpleRestProvider from 'ra-data-simple-rest';
import { PostList } from './Posts';

const dataProvider = simpleRestProvider('http://localhost:8000');

const App = () => (
    <Admin dataProvider={dataProvider}>
        <Resource name="posts" list={PostList} />
    </Admin>
);

export default App;

react-admin 监听http://localhost:3000/#/posts

Api 正在运行：http://localhost:8000/posts，它返回响应为。

$response = new JsonResponse($output);
$response->headers->set('Content-Range', 'posts 0-0/5');
$response->headers->set('Access-Control-Expose-Headers', 'Content-Range');
$response->headers->set('Access-Control-Allow-Origin', '*');
$response->headers->set("Access-Control-Allow-Headers", "Content-Type, Accept, X-Requested-With");

将某些东西返回为

{
    "data": [
        {
            "id": "1",
            "title": "Hello world",
            "body": "Hello world"
        },
        {
            "id": "2",
            "title": "Hello world",
            "body": "Hello world"
        }
    ],
    "total": 2
}

我收到一个错误

对“GET_LIST”的响应必须类似于 { data : [...] }，但接收到的数据不是数组。 'GET_LIST' 的 dataProvider 可能是错误的

如果data 键被删除为

[
    {
        "id": "1",
        "title": "Hello world",
        "body": "Hello world"
    },
    {
        "id": "2",
        "title": "Hello world",
        "body": "Hello world"
    }
]

正在得到结果。

【问题讨论】：

为支持 CORS 所做的更多更改。
由于某种原因，它显示 Failed to fetch 在哪里？
嗨，我已经更新了这个问题。 Failed to Fetch 显示为红色，这是由于更多与 CORS 相关的问题。所以添加了适当的标题。当前问题是The response to 'GET_LIST' must be like { data : [...] }, but the received data is not an array. The dataProvider is probably wrong for 'GET_LIST'

标签： react-admin

【解决方案1】：

最后我明白这是 react-admin 所期望的。

问题出在我注意到的documentation

这让我很困惑。

仔细查看https://github.com/marmelab/react-admin/blob/1b6967f3367b13a6675de7047bd9385dc36a8db5/packages/ra-data-simple-rest/src/index.js#L118，我了解到数据是由提供者重建的。

【讨论】：

是的。您是否看到我们可以改进文档或其他什么的方法？此外，您可以将您的答案标记为“自我回答”
> 你觉得我们有什么办法可以改进文档吗？我今天重读了这篇文章，“React-admin 期望来自数据提供者的响应是具有数据属性的对象。”我想我错过了清楚地认识到它是在谈论数据提供者而不是返回响应的 url。可能会使数据提供者加粗，以便清楚地突出显示？ > 另外，您可以将您的答案标记为“自我回答” 您在哪里可以标记这个？我没有找到那个选项，即为什么。大多数情况下我不喜欢自己回答，但回答这个问题可能对其他人有所帮助，即我写它的唯一原因。
这个答案对我有帮助，@Kmaschta 我想也许 marmelab.com/react-admin/DataProviders.html 在“使用”部分下的注释中提到了简单 REST 数据提供程序会有所帮助；类似于“注意ra-data-simple-rest 包会自动处理创建具有data 属性的对象”。

【解决方案2】：

我遇到同样的问题，在检查了我的 API 响应后，我了解到对象中缺少一个字段：

{ "data": [ { "id": "1", "title": "Hello world", "body": "Hello world" }, { "title": "Hello world", "body": "Hello world" } ], "total": 2 }

id 在第二个 obj 中丢失。这就是我面临这个问题的原因

任何遇到此问题的人请检查您的 API 响应中的所有字段。

【讨论】：

欢迎来到 SO！你能解释一下你的答案吗？你检查你的 API 并且你发现了（一些东西，所以暴露哪一个）……截图会有所帮助。
{ "data": [ { "id": "1", "title": "Hello world", "body": "Hello world" }, { "title": "Hello world", "body": "Hello world" } ], "total": 2 } id 在第二个 obj 中丢失。这就是我面临这个问题的原因
请检查上述答案。