使用中继执行本机graphql查询：未收到提取的数据

Question

我有以下查询：

query {
  viewer{
    place(id: "1a4871311fe990d6d94cf1eed9fd65008856e118b790e7dcf728d86bc3aef7ec"){
      name
    }
  }
}

当然可以在GraphiQL上正常运行。我想在Relay容器中使用此查询，因此我创建了一个RootContainer：

<RootContainer
  Component={PlaceDetailsComponent}
  route={new PlaceDetailsRoute({placeID: this.props.id})}
  renderFetched={(data) => {
    console.log('data: ', data);
    return (
      <PlaceDetailsComponent {...this.props} {...data}/>
    )
  } }
  renderLoading={() => <ProgressBar visible={true} />}/>

成功获取数据，但我在控制台上看到的只有：

data:  { placeID: '1a4871311fe990d6d94cf1eed9fd65008856e118b790e7dcf728d86bc3aef7ec',
  viewer: 
   { __dataID__: 'Vmlld2VyLXs6aWQ9PiJ2aWV3ZXIifQ==',
     __fragments__: { '1::client': [ {} ] } } }

所以我查看了实际发送给服务器的内容以及收到的内容，对我来说似乎都是正确的：

这是我的路线：

import Relay, { 
  Route
} from 'react-relay';

class PlaceDetailsRoute extends Route {
  static queries = {
    viewer: () => Relay.QL`
      query {
        viewer 
      }
      `
  }
  static routeName = 'PlaceDetailsRoute'
}

export default PlaceDetailsRoute;

这是我的片段：

Relay.createContainer(PlaceDetailsContainer, {
  fragments: {
    viewer: () => Relay.QL`
      fragment on Viewer  {
        place(id: "1a4871311fe990d6d94cf1eed9fd65008856e118b790e7dcf728d86bc3aef7ec") {
          name,
        }
      }
      `
  }
});

有什么建议我应该改变什么？在此先感谢您的帮助！

Answer 1

这实际上是预期的行为。 Relay documentation of renderFetched有一个注释：

  

即使我们可以访问data中的renderFetched对象，但实际数据是故意不透明的。这可以防止renderFetched对Component声明的片段创建隐式依赖。

希望这可以解决你的困惑。