GraphQL查询Gatsby中的单个JSON对象

时间:2019-03-07 14:38:20

标签: json graphql gatsby

我已经使用gatsby cli创建了基本的盖茨比应用程序,我正在尝试使用 gatsby-transformer-json gatsby-source-filesystem 插件检索静态JSON数据来自StaticQuery组件。

我的最终目标是呈现由无头CMS生成的静态JSON数据。更新JSON应该会更新由插件生成的GraphQL模式。

按照this topic中提供的文档并使用技巧,我建立了以下结构。

测试目的数据如下

{
  "name": "first",
  "age": 34,
  "test": "test1",
  "children": [
    {
      "id":1,
      "child":"child1"
    },
    {
      "id":2,
      "child":"child2"
    }
  ]
}

它的位置如下

 src/data/test/test.json

我的GraphiQL查询看起来像这样

{
  testJson {
    name
    age
    children {
      id
      child
    }
  }
}

此查询当前导致以下

 {
      "data": {
        "testJson": {
          "name": "first",
          "age": 34,
          "test": "test1",
          "children": []
        }
      }
    }

由于某些原因,我无法继续查询儿童嵌套数组中的数据。

"children": []

从CMS导出的数据由许多嵌套数组组成,这些数组我目前无法访问。我得到的只是顶层空数组。

我在这里是否缺少基本概念?或者插件是否在努力从给定的JSON解析正确的GraphQL模式?

我已经仔细阅读了文档,似乎找不到解决方法。

1 个答案:

答案 0 :(得分:2)

children用于internally,用于创建Node之间的层次结构。

只需将children重命名为其他名称,就可以了:

{
    "name": "first",
    "age": 34,
    "test": "test1",
    "foos": [
      {
        "id": 1,
        "child": "child1"
      },
      {
        "id": 2,
        "child": "child2"
      }
    ]
}

现在运行相应的查询:

{
  testJson {
    name,
    foos {
      id,
      child
    }
  }
}

结果将符合预期:

{
  "data": {
    "testJson": {
      "name": "first",
      "foos": [
        {
          "id": 1,
          "child": "child1"
        },
        {
          "id": 2,
          "child": "child2"
        }
      ]
    }
  }
}