【问题标题】:Nested fragment data always the same in Relay嵌套片段数据在中继中始终相同
【发布时间】:2016-07-13 11:41:58
【问题描述】:

我是 Relay 新手,遇到片段上的嵌套数据问题。

当我在 graphiql 中测试时,以下查询返回正确的数据,因此我确信我的架构是正确的。

 {
  viewer {
    customers {
      name
      billing_address {
        city
      }
    } 
  }
}

但是,当我将上述查询与 Relay 一起使用时,customer.name 将是正确的,但 customer.billing_address.city 对于每个客户都是相同的。我很困惑为什么一些数据是正确的,而嵌套数据只是被复制。

我将不胜感激有关此问题的任何帮助,如果需要更多信息,我很乐意添加。以下是我项目中目前唯一的中继代码,我认为问题可能出在哪里。

class App extends Component {
  render() {
    console.log(this.props.viewer.customers);
    return (
      <div>
      {this.props.viewer.customers.map((customer) => (
        <div>
          <div>{customer.name}</div>
          <div>{customer.billing_address.city}</div>
        </div>
      ))}
      </div>
    );
  }
}

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

const AppContainer =  Relay.createContainer(App, {
  fragments: {
    viewer: () => Relay.QL`
      fragment on Viewer {
        customers{
          name
          billing_address{
            city
          }
        }
      }`
  },
});

ReactDOM.render(
  <Relay.RootContainer
    Component={AppContainer}
    route={new AppHomeRoute()}
  />,
  document.getElementById('root')
);

【问题讨论】:

  • 一个可能的问题是您如何在 GraphQL 架构中解析 billing_address。您是否在 billing_address GraphQL 类型中包含了 field :id, !types.IDglobalIdField?发布您的 GraphQL 架构也可能会有所帮助。
  • @nethsix 非常感谢您的帮助。这基本上就是问题所在。我正在使用 Mongo 作为我的后端,并且正在使用一个 mongo 没有提供 ObjectID 的嵌入式文档,即使我试图在我的模式中访问它。我刚刚从 mongo 中的嵌入式切换到 ref,它运行良好。再次感谢。
  • 我很高兴这个建议有所帮助。您介意我将 cmets 作为问题的答案吗?
  • 一点也不。我是堆栈溢出的新手。如果您将其移至答案,我可以接受吗?
  • 谢谢!您也可以投票给 cmets。下次试试。

标签: javascript reactjs graphql relay


【解决方案1】:

一个可能的问题是您如何在 GraphQL 架构中解析 billing_address。您是否在 billing_address GraphQL 类型中包含 field :id, !types.IDglobalIdField?发布您的 GraphQL 架构也可能会有所帮助。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-03-13
    • 1970-01-01
    • 2014-02-21
    • 2013-12-31
    • 1970-01-01
    • 1970-01-01
    • 2014-06-02
    • 1970-01-01
    相关资源
    最近更新 更多