javascript - 在graphql中构建嵌套结构

我是GraphQL的新手，正在尝试解决经理向我提出的问题。

我通过第三方API（对我的控制为零）可以使用以下数据结构：

[
  {
    "id": 19,
    "date": "2016-10-24T13:59:19",
    "date_gmt": "2016-10-24T12:59:19",
    "slug: "data",
    "provider": {
      "name": "data",
      "logo": "data",
      "destination_url": "data",
      "coupon_label": "data",
      "coupon_text": "data",
      "coupon_code": "data",
      "coupon_url": "data",
    }
  }
]

我需要将其转换为类似于以下查询的GraphQL模式：

{
  provider(slug: "slug") {
    id
    date
    slug
    name
    logo
    url
    coupon {
      label
      text
      code
      url
    }
  }
}

我已经用下面的代码设法解决了大部分问题，但是，我不知道如何将优惠券节点分组为一个。

我猜想这需要是另一种自定义类型吗？如果是这样，这似乎效率很低，因为优惠券将永远不会在提供者类型之外使用，所以我想知道是否还有一种我不知道的“最佳实践”方法。

import { GraphQLObjectType, GraphQLInt, GraphQLString } from 'graphql'

const ProviderType = new GraphQLObjectType({
  name: 'Provider',
  fields: () => ({
    id: {
      type: GraphQLInt,
      description: 'The primary key for the provider'
    },
    slug: {
      type: GraphQLString,
      description: 'A unique string for the provider'
    },
    status: {
      type: GraphQLString,
      description: 'The the published status of the provider'
    },
    name: {
      type: GraphQLString,
      description: 'The name of the provider',
      resolve (parent) { return parent.provider.name }
    },
    logo: {
      type: GraphQLString,
      description: 'The full url of the provider logo',
      resolve (parent) { return parent.provider.logo }
    },
    url: {
      type: GraphQLString,
      description: 'The full url of the provider',
      resolve (parent) { return parent.provider.destination_url }
    },
  })
})

export default ProviderType

更新：

我已将代码更新为以下代码，但仍无法正常工作，因此我的假设一定不正确（或者我实现不正确）

const ProviderType = new GraphQLObjectType({
  name: 'Provider',
  fields: () => ({
    id: {
      type: GraphQLInt,
      description: 'The primary key for the provider'
    },
    slug: {
      type: GraphQLString,
      description: 'A unique string for the provider'
    },
    status: {
      type: GraphQLString,
      description: 'The the published status of the provider'
    },
    name: {
      type: GraphQLString,
      description: 'The name of the provider',
      resolve (parent) { return parent.provider.name }
    },
    logo: {
      type: GraphQLString,
      description: 'The full url of the provider logo',
      resolve (parent) { return parent.provider.logo }
    },
    url: {
      type: GraphQLString,
      description: 'The full url of the provider',
      resolve (parent) { return parent.provider.destination_url }
    },
    coupon: {
      type: CouponType,
      description: 'The coupon information for the provider'
    }
  })
})

const CouponType = new GraphQLObjectType({
  name: 'Coupon',
  fields: () => ({
    label: {
      type: GraphQLString,
      description: 'The label for the coupon',
      resolve (parent) { return parent.provider.coupon_label }
    },
    text: {
      type: GraphQLString,
      description: 'The text for the coupon',
      resolve (parent) { return parent.provider.coupon_text }
    },
    code: {
      type: GraphQLString,
      description: 'The code for the coupon',
      resolve (parent) { return parent.provider.coupon_code }
    },
    url: {
      type: GraphQLString,
      description: 'The url for the coupon',
      resolve (parent) { return parent.provider.coupon_url }
    }
  })
})

最佳答案

您的架构基本上是正确的，但是您需要在provider中的优惠券字段上使用解析器，因为它是嵌套类型。请参阅启动板示例以进行交互式查询https://launchpad.graphql.com/r995kzj5kn

这是代码。为了简洁起见，我已删除了您的描述，并添加了一些测试数据

import {
  GraphQLObjectType,
  GraphQLSchema,
  GraphQLString,
  GraphQLInt,
  GraphQLList
} from 'graphql'

const data = [
  {
    "id": 19,
    "date": "2016-10-24T13:59:19",
    "date_gmt": "2016-10-24T12:59:19",
    "slug": "slug",
    "provider": {
      "name": "provider.name",
      "logo": "provider.logo",
      "destination_url": "provider.destination_url",
      "coupon_label": "provider.coupon_label",
      "coupon_text": "provider.coupon_text",
      "coupon_code": "provider.coupon_code",
      "coupon_url": "provider.coupon_url",
    }
  },
    {
    "id": 20,
    "date": "2016-10-24T13:59:19",
    "date_gmt": "2016-10-24T12:59:19",
    "slug": "slugplug",
    "provider": {
      "name": "provider.name",
      "logo": "provider.logo",
      "destination_url": "provider.destination_url",
      "coupon_label": "provider.coupon_label",
      "coupon_text": "provider.coupon_text",
      "coupon_code": "provider.coupon_code",
      "coupon_url": "provider.coupon_url",
    }
  }
]

const CouponType = new GraphQLObjectType({
  name: 'Coupon',
  fields: () => ({
    label: {
      type: GraphQLString,
      resolve (parent) { return parent.provider.coupon_label }
    },
    text: {
      type: GraphQLString,
      resolve (parent) { return parent.provider.coupon_text }
    },
    code: {
      type: GraphQLString,
      resolve (parent) { return parent.provider.coupon_code }
    },
    url: {
      type: GraphQLString,
      resolve (parent) { return parent.provider.coupon_url }
    }
  })
})

const ProviderType = new GraphQLObjectType({
  name: 'Provider',
  fields: () => ({
    id: { type: GraphQLInt },
    date: { type: GraphQLString },
    slug: { type: GraphQLString },
    status: { type: GraphQLString },
    name: {
      type: GraphQLString,
      resolve (parent) { return parent.provider.name }
    },
    logo: {
      type: GraphQLString,
      resolve (parent) { return parent.provider.logo }
    },
    url: {
      type: GraphQLString,
      resolve (parent) { return parent.provider.destination_url }
    },
    coupon: {
      type: CouponType,
      resolve(parent) {
        return parent
      }
    }
  })
})

const Query = new GraphQLObjectType({
  name: 'Query',
  fields: {
    provider: {
      type: new GraphQLList(ProviderType),
      args: {
        slug: { type: GraphQLString }
      },
      resolve (source, args) {
        return args.slug ?
          data.filter(({ slug }) => slug === args.slug) :
          data
      }
    }
  }
})

const schema = new GraphQLSchema({
  query: Query
});

另外，您也可以在根解析器中修改结果，然后将其发送如下，如下所示。这将允许您从类型中删除所有解析程序，但提供程序上的coupon只会返回parent.coupon

const Query = new GraphQLObjectType({
  name: 'Query',
  fields: {
    provider: {
      type: new GraphQLList(ProviderType),
      args: {
        slug: { type: GraphQLString }
      },
      resolve (source, args) {
        const filtered = args.slug ?
          data.filter(({ slug }) => slug === args.slug) :
          data
        return filtered.map(doc => {
          return {
            id: doc.id,
            date: doc.date,
            slug: doc.slug,
            name: doc.provider.name,
            logo: doc.provider.logo,
            url: doc.provider.coupon_url,
            coupon: {
              label: doc.provider.coupon_label,
              text: doc.provider.coupon_text,
              code: doc.provider.coupon_code,
              url: doc.provider.coupon_url
            }
          }
        })
      }
    }
  }
})

关于javascript - 在graphql中构建嵌套结构，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/47872710/