如何在 GraphQL 中对递归数据结构进行建模

Question

我有一个树形数据结构，我想通过 GraphQL API 返回它。

该结构不是特别大（小到足以在一次调用中返回它不会成为问题）。

结构的最大深度没有设置。

我已经将结构建模为：

type Tag{
    id: String!
    children: [Tag]
}

当人们想要将标签获得任意深度时就会出现问题。

要让所有孩子（例如）达到 3 级，可以编写如下查询：

{ tags { id children { id children { id } } } }

有没有办法编写查询以将所有标签返回到任意深度？

如果不是，在 GraphQL API 中为上述结构建模的推荐方法是什么。

Answer 1

如果您愿意放弃 GraphQL 提供的类型安全和子字段查询以及通过 ID 缓存和引用对象的能力，那么另一个选择是将数据编码为 JSON。 gaphql-type-json 包提供了解析器来简化此操作。这些也包含在graphql-scalars 的许可下，其中包含许多其他方便的标量。

我正在为定义动态表单控件的分层数据执行此操作。在这种情况下，没有任何 ID 会丢失，因此很容易获胜。

Answer 2

前段时间我想出了另一个解决方案，与@WuDo 建议的方法相同。

这个想法是使用 ID 在数据级别上扁平化树以引用它们（每个孩子都有它的父母）并标记树的根，然后在客户端再次递归地构建树。​​

这样您就不必担心像@samcorcos 的回答那样限制查询的深度。

架构：

type Query {
    tags: [Tag]
}

type Tag {
    id: ID!
    children: [ID]
    root: Boolean
}

回复：

{ 
    "tags": [
        {"id": "1", "children": ["2"], "root": true}, 
        {"id": "2", "children": [], "root": false}
    ] 
}

客户端树构建：

import find from 'lodash/find';
import isArray from 'lodash/isArray';

const rootTags = [...tags.map(obj => {...obj)}.filter(tag => tag.root === true)];
const mapChildren = childId => {
    const tag = find(tags, tag => tag.id === childId) || null;

    if (isArray(tag.children) && tag.children.length > 0) {
        tag.children = tag.children.map(mapChildren).filter(tag => tag !== null);
    }
}
const tagTree = rootTags.map(tag => {
    tag.children = tag.children.map(mapChildren).filter(tag => tag !== null);
    return tag;
});