如何在 GraphQL 中建模递归数据结构 [英] How to model recursive data structures in GraphQL

问题描述

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

I have a tree data structure that I would like to return via a GraphQL API.

结构不是特别大(足够小，一次调用返回它不是问题).

The structure is not particularly large (small enough not to be a problem to return it in one call).

未设置结构的最大深度.

The maximum depth of the structure is not set.

我已将结构建模为:

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

当想要获取任意深度的标签时就会出现问题.

The problem appears when one wants to get the tags to an arbitrary depth.

为了让所有孩子(例如)达到第 3 级，可以编写如下查询:

To get all the children to (for example) level 3 one would write a query like:

<代码>{标签{ID孩子们 {ID孩子们 {ID}}}}

有没有办法编写一个查询来将所有标签返回到任意深度?

Is there a way to write a query to return all the tags to an arbitrary depth?

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

If not what is the recommended way to model a structure like the one above in a GraphQL API.

推荐答案

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

Some time ago I came up with another solution, which is the same approach like @WuDo suggested.

我们的想法是在数据级别上使用 ID 将树展平以引用它们(每个子项及其父项)并标记树的根，然后在客户端再次递归构建树.

The idea is to flatten the tree on data level using IDs to reference them (each child with it's parent) and marking the roots of the tree, then on client side build up the tree again recursively.

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

This way you should not worry about limiting the depth of your query like in @samcorcos's answer.

架构:

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;
});

这篇关于如何在 GraphQL 中建模递归数据结构的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！