reactjs - 当架构具有嵌套对象时，在带有 ra_data_graphql_simple 的 React-admin 中超出了最大调用堆栈大小

Question

我首先尝试将react-admin作为应用程序的一些简单数据输入的管理解决方案，但我发现缺少文档，经过几个小时的调试后，我已经在网上搜索了解决方案。

我的问题:

当嵌套对象出现在我的架构中时，如下所示..

type Country {
country_id: ID!
name: String
abbr2: String
abbr3: String
provincesOrStates: [ProvinceState]}

react-admin 将失败并出现错误:超出最大调用堆栈大小。在这种情况下，在内省(introspection)之后它甚至不会调用我的 graphql 服务器，我可以在我的开发人员工具中看到这一点。我的后端是 Apollo Server，使用 Sequelize 作为我的 ORM，我的依赖项如下:

"dependencies": {
"apollo-server": "^2.4.2",
"dataloader-sequelize": "^1.7.9",
"dotenv": "^6.2.0",
"graphql": "^14.1.1",
"graphql-import": "^0.7.1",
"graphql-list-fields": "^2.0.2",
"graphql-tools": "^4.0.4",
"lodash": "^4.17.11",
"merge-graphql-schemas": "^1.5.8",
"pg": "^7.8.0",
"pg-hstore": "^2.3.2",
"save": "^2.3.3",
"sequelize": "^4.42.0"}

我应该注意到，GraphiQL 可以很好地处理嵌套对象并返回预期的数据。该模式的建模方式与 marmelabs 的简单数据提供程序所建议的方式完全相同

我的react-admin没什么特别的...它的设置与他们在自述文件中列出的示例完全相同...我的App.js代码如下

import React, { Component } from 'react';
import { Admin, Resource, ListGuesser } from 'react-admin';
import buildGraphQLProvider from 'ra-data-graphql-simple';


class App extends Component {
    constructor() {
        super();
        this.state = { dataProvider: null };
    }
    componentDidMount() {

        buildGraphQLProvider({ clientOptions: { uri: 'http://localhost:3030/graphql' }})
            .then(dataProvider => this.setState({ dataProvider }));
    }

    render() {
        const { dataProvider } = this.state;

        if (!dataProvider) {
            return <div>Loading</div>;
        }

        return (
            <Admin dataProvider={dataProvider}>
                <Resource name="Country" options={{ label: 'Countries' }} list={ListGuesser}/>
            </Admin>
        );
    }
}

export default App;

我在该项目中的依赖项是:

"dependencies": {
    "graphql": "^14.1.1",
    "prop-types": "^15.7.1",
    "ra-data-graphql-simple": "^2.7.1",
    "ra-data-json-server": "^2.7.1",
    "ra-data-simple-rest": "^2.7.1",
    "react": "^16.8.1",
    "react-admin": "^2.7.1",
    "react-dom": "^16.8.1",
    "react-scripts": "2.1.5"
  }

它将调用发送到 allCountries 的 graphql 服务器的唯一方法是，当内省(introspection)查询运行时，Country 对象中没有嵌套。为了确定这一点，我反复测试了它。显然我需要它。我还认为 ListGuesser 可能是一个问题，所以我把它拿出来并放入一个只需要名称的简单 CountryList 组件...这没有帮助。

我还查看了基于超出最大调用堆栈的其他相关问题，但我不确定该消息不仅仅是一个红鲱鱼，因为模式对象是否嵌套不应该在 UI 中出现，如果它正在忽略它。我输入控制台日志以确保我没有陷入无限循环(不知道 react 良好)，事实上我没有，显然，因为这个示例代码将是大多数人的登陆点，所以它必须适用于大多数人。

有人能给我指出正确的方向吗？

Answer 1

好吧，我不知道发生了什么，但有人在这里发布了一个答案，我在手机屏幕上看到了一点点..足以知道他们问我的省是否与国家有关系，而且确实如此.. 当我回到笔记本电脑时，答案已被删除或消失，但这确实是问题所在...无论是谁回答，在我解决这个问题之前，它都让我省去了更多的麻烦。

因此，对于任何遇到类似问题的人来说，在 Sequelize 中进行关联的方式要非常小心，并从小事做起。在react-admin和Apollo Server之间来回切换，这让我搞砸了，浪费了时间。内省(introspection)指出了问题，但我不是前端开发人员，我不知道在哪里解决它。 GraphiQL 没有指出这一点，因为我没有以向我展示问题的方式调用查询...当我把这些东西全部排序后，我会很乐意贡献更多...干杯