Relay Modern - 如何在没有 fragmentContainer 的情况下使用 fetchQuery答案

【问题标题】：Relay Modern - How to use fetchQuery without fragmentContainerRelay Modern - 如何在没有 fragmentContainer 的情况下使用 fetchQuery
【发布时间】：2017-11-15 03:30:02
【问题描述】：

所以我正在为 React 应用程序与服务器端渲染进行中继。我正在尝试使用中继从 graphql 端点获取数据。

我有点关注this，使用fetchQuery 通过中继编译器从已编译的graphql 发出请求来获取数据。

例如

import { graphql, fetchQuery } from 'react-relay'

const query = graphql`
   query SomeQuery($id: ID) {
      author(id: $id) {
         name
         ...SomeFragment_authorData
      }
   }
`

const variables = { "id" : "1f" };

fetchQuery(env, query, variables)
   .then((jsonData) => { console.log(jsonData); })

当它完成运行时，它会给我某种对象：

{
  author: {
    __fragment: { ... }
    ...
  }
}

我假设用createFragmentContainer() 包裹的子组件将使用它来获取真实数据。

由于我没有使用createFragmentContainer()，我不确定如何正确获取数据，有没有办法将上述响应转换为真实数据？任何帮助将不胜感激！

注意：

目前这是我获取数据的方法：env._network.fetch(query(), variables)。它正在工作，但我需要挖掘私有变量以获取我提供给Network 对象的fetch 似乎不正确。

【问题讨论】：

在您链接的文章中fetchQuery 是从relay-runtime 导入的，而不是react-relay。也许改变这种方式，您可以在响应中获得您期望的数据。
react-relay 正在从 relay-runtime 重新导出 fetchQuery

标签： javascript ecmascript-6 graphql relayjs relay

【解决方案1】：

您需要在片段传播中添加一个中继指令： ...SomeFragment_authorData @relay(mask: false)

【讨论】：

我能知道为什么吗？我不明白“@relay(mask: false)”

【解决方案2】：

您可以使用中继环境和中继运行时实用程序。

import {
  createOperationDescriptor,
  getRequest,
} from 'relay-runtime';


const request = getRequest(query);
const operation = createOperationDescriptor(request, variables);
environment.execute({ operation }).toPromise();

【讨论】：