简体   繁体   English

如何为GraphQLObjectType的GraphQLList定义中继片段?

[英]How to define Relay fragment for GraphQLList of GraphQLObjectType?

I've got a graphql-java implementation and a schema defined. 我有一个graphql-java实现和一个定义的模式。 Is it possible to create a field of type GraphQLList(SomeGraphQLObjectType) in a GraphQL query and use it in a Relay.QL {} declaration fragment, so I can receive a list of the desired object? 是否可以在GraphQL查询中创建GraphQLList(SomeGraphQLObjectType)类型的字段,并在Relay.QL {}声明片段中使用它,以便我可以接收所需对象的列表? Is this the place where Relay "Connections" work? 这是中继“连接”工作的地方吗?

export default Relay.createContainer(ChildComponent, {
  fragments: {
    item: () => Relay.QL`
      fragment on Item
      {
        id,
        name,
        color{
          id,
          name
        }
      }`
  }});


export default Relay.createContainer(ParentComponent, {
  fragments: {
    list: () => Relay.QL`
    fragment on ListOfItems{
       allItems
       {
         ${ChildComponent.getFragment('item')}
       }
    }`
  }
});

Is it possible to create a field of type GraphQLList(SomeGraphQLObjectType) in a GraphQL query and use it in a Relay.QL {} declaration fragment? 是否可以在GraphQL查询中创建GraphQLList(SomeGraphQLObjectType)类型的字段并将其用于Relay.QL {}声明片段中?

Yes, it's possible with the help of @relay(plural: true) directive. 是的,可以在@relay(plural: true)指令的帮助下@relay(plural: true) It tells Relay that this field is a list, instead of a single item. 它告诉Relay这个字段是一个列表,而不是单个项目。

Define the field like this, where Item is a GraphQLObjectType with the same name : 定义这样的字段,其中Item是具有相同name的GraphQLObjectType:

itemList: {
  type: new GraphQLList(Item),
  // other stuff including resolve function
},

Since you have divided your Relay containers as parent and child, define the parent container like this: 由于已将中继容器划分为父容器和子容器,因此请定义父容器,如下所示:

export default Relay.createContainer(ParentComponent, {
  fragments: {
    itemList: () => Relay.QL`
      fragment on Item @relay(plural:true) {
        ${ChildComponent.getFragment('item')}
      }
    `,
  },
});

and the child container like this: 和这样的子容器:

export default Relay.createContainer(ChildComponent, {
  fragments: {
    item: () => Relay.QL`
      fragment on Item {
        id,
        name,
        color {
          id,
          name,
        }
      }
    `,
  },
});

You can learn more about Relay directives in this article by Clay Allsopp. 您可以在Clay Allsopp的本文中了解有关Relay指令的更多信息。

There's a similar question which you can take a look at too. 还有一个类似的问题 ,您也可以看一下。

Is this the place where Relay "Connections" work? 这是中继“连接”工作的地方吗?

It depends. 这取决于。 If you do not want all items in one shot, then connection is the way to go. 如果您不想一目了然,那么连接就是您的理想之选。 It enables fetching data incrementally. 它使增量获取数据成为可能。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM