使用 Relay 将片段委托给 children

Question

我想在一个组件中做这样的事情：

Relay.createContainer(Component, {
  fragments: {
    thing: AnotherComponent.getFragment('thing')
  }
}

理想情况下，这会将我当前组件上的片段 thing 设置为在其 child 组件之一上使用片段 thing。有效地将了解 thing 是什么的责任委托给使用它的任何人。然后包含 Component 的组件可以调用 Component.getFragment('thing')，这将调用 AnotherComponent.getFragment('thing')。

有人知道怎么做吗？

更新

我发现完成这项工作的唯一方法是通过像

这样的语法

Relay.createContainer(Component, {
  fragments: {
    thing: Relay.QL`
      ${AnotherComponent.getFragment('thing')}
    `
  }
}

这正确命中了服务器，服务器执行了AnotherComponent指定的查询，但是现在Component[的props中没有提供查询的return值

更新 2

我发现这种类型的重复嵌套会产生如下查询：

query Router {

  store {

    ...F3

  }

}
fragment F0 on Store {

  _fields2w4En2:fields(labels:["Country","Function"],owner_type:"requisitions") {

    choices {

      id,

      label

    },

    id
,

    label
  }

}
fragment F1 on Store {

  ...F0

}
fragment F2 on Store {

  ...F1

}
fragment F3 on Store {

  ...F2

}

我在基本级别的哪里有这样的查询：

export default Relay.createContainer(SearchBar, {
  fragments: {
    searchFields: () => Relay.QL`
      fragment searchFields on Store {
        searchFields: fields(labels: ["Country", "Function"], owner_type: "requisitions") {
          label
          choices {
            id
            label
          }
        }
      }
    `,
  },
});

Answer 1

所以直接方法不起作用的原因是因为 getFragment 实际上 return 不是片段（呃），而是对特定于容器的片段的引用声明它。幸运的是你可以从中得到普通的片段，与：AnotherComponent.getFragment('thing').getFragment()。

请参阅 this playground example 进行演示

使用 Relay 将片段委托给 children

Delegating fragments to children with Relay

reactjs

graphql

relayjs

更新