如何正确使用 GraphQLList 和 GraphQLInterfaceType？答案

【问题标题】：How do you use GraphQLList and GraphQLInterfaceType correctly?如何正确使用 GraphQLList 和 GraphQLInterfaceType？
【发布时间】：2016-08-17 07:18:06
【问题描述】：

我从 GraphQL 开始。我正在尝试将数据解析为 GraphQL 类型。我不明白为什么以下不起作用。

鉴于此数据：

{
    "kind": "youtube#searchListResponse",
    "etag": "\"CuSCwMPVmgi8taDtE2LV6HdgkN0/USvbH1nSht52L3y8EP6BIwVRhgM\"",
    "items": [{
        "kind": "youtube#searchResult",
        "etag": "\"CuSCwMPVmgi8taDtE2LV6HdgkN0/xpywjUARlQ0Ai4IucTvXRNCfTcE\"",
        "id": {
            "kind": "youtube#video",
            "videoId": "zvRbU1Ql5BQ"
        }
    }]
}

这是输入的代码。

const ItemType = new GraphQLInterfaceType({
  name: 'Item',
  fields: {
    kind: { type: StringType },
  },
});

const YoutubeDataType = new GraphQLObjectType({
  name: 'PublicYoutube',
  fields: {
    kind: { type: new GraphQLNonNull(StringType) },
    etag: { type: new GraphQLNonNull(StringType) },
      items: { type: new GraphQLList(ItemType) },  // returns null
    // items: { type: StringType }, // returns "[object Object]"... so it's being passed in
  },
});

这是通过 GraphiQL 返回的内容。为什么items 等于null？

{
  "data": {
    "publicyoutube": {
      "kind": "youtube#searchListResponse",
      "etag": "\"CuSCwMPVmgi8taDtE2LV6HdgkN0/OspGzY61uG9sSD_AWlfwkTBjG-8\"",
      "items": [
        null
      ]
    }
  },
  "errors": [
    {
      "message": "Cannot read property 'length' of undefined"
    }
  ]
}

感谢您的帮助。

【问题讨论】：

标签： javascript graphql

【解决方案1】：

我误解了 GraphQLInterfaceType 的用途，使用了错误的方法。而不是使用GraphQLInterfaceType，应该是GraphQLObjectType；

const ItemType = new GraphQLObjectType({
  name: 'Item',
  fields: {
    kind: { type: StringType },
  },
});

const YoutubeDataType = new GraphQLObjectType({
  name: 'PublicYoutube',
  fields: {
    kind: { type: new GraphQLNonNull(StringType) },
    etag: { type: new GraphQLNonNull(StringType) },
      items: { type: new GraphQLList(ItemType) },  // returns null
    // items: { type: StringType }, // returns "[object Object]"... so it's being passed in
  },
});

输出：

{
  "data": {
    "publicyoutube": {
      "kind": "youtube#searchListResponse",
      "etag": "\"CuSCwMPVmgi8taDtE2LV6HdgkN0/-aZNXBVLYOJwPMdleXmbTlJSo_E\"",
      "items": [
        {
          "kind": "youtube#searchResult"
        }
      ]
    }
  }
}

【讨论】：