中继.访问同级组件的数据

Question

玩接力 我在访问数据时遇到了问题。我试图重现中继项目的官方待办事项示例的问题。请考虑要点以更改待办事项示例。这里

以下是问题：

1. 为什么摘要组件无法访问同级（查看器）组件数据？
2. "查询必须只有一个字段"的原因是什么？我相信 GraphQL 没有这样的限制。
3. 为什么我得到不变违规：Relay（TodoApp）.getFragment（）：summary不是有效的片段名称？

提前感谢！

Answer 1

1. Summary想要从查看器使用的任何数据都必须在Summary容器中声明为 GraphQL，并一直组合到应用程序的根目录。

   class Summary extends React.Component {
     render() {
       return <span>{this.props.viewer.bar}</span>;
     }
   }
   export default Relay.createContainer(Summary, {
     fragments: {
       viewer: () => Relay.QL`
         fragment on Viewer {
           bar
         }
       `,
     },
   });
   class TodoApp extends React.Component {
     render() {
       return <Summary viewer={this.props.viewer} />;
     }
   }
   export default Relay.createContainer(TodoApp, {
     fragments: {
       viewer: () => Relay.QL`
         fragment on Viewer {
           foo
           ${Summary.getFragment('viewer')}
         }
       `,
     },
   });
   

   请注意，foo字段在 Summary 中不可用。我们把它掩盖了，因为Summary没有要求它。

2. 一个Relay.Route中可以有多个查询，但每个查询只能有一个根字段。我们需要这种一对一的对应关系，以便我们知道将哪个结果分配给哪个道具。

   class MyRoute extends Relay.Route {
     queries: {
       summary: () => Relay.QL`query { summary }`,
       viewer: () => Relay.QL`query { viewer }`,
     },
     /* ... */
   }
   

3. 您需要将摘要片段一直撰写到应用程序的根目录，使其在 TodoApp 上可用。

   export default Relay.createContainer(TodoApp, {
     fragments: {
       summary: () => Relay.QL`
         fragment on Summary {
           ${Summary.getFragment('summary')}
         }
       `,
     },
   });