嵌套片段数据在中继中始终相同 [英] Nested fragment data always the same in Relay

问题描述

我是 Relay 的新手，我遇到了片段上嵌套数据的问题.

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

<代码> {观众{顾客 {名称帐单地址 {城市}}}}

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

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

class App 扩展组件 {使成为() {控制台日志(this.props.viewer.customers)；返回 (<div>{this.props.viewer.customers.map((customer) => (<div><div>{customer.name}</div><div>{customer.billing_address.city}</div>

))}

);}}类 AppHomeRoute 扩展了 Relay.Route {静态查询 = {查看器: () =>中继.QL`询问 {观众}`，};静态路由名称 = 'AppHomeRoute';}const AppContainer = Relay.createContainer(App, {片段:{查看器: () =>中继.QL`查看器上的片段{顾客{名称帐单地址{城市}}}`},});ReactDOM.render(<Relay.RootContainer组件={应用容器}路线={新的AppHomeRoute()}/>,document.getElementById('root'));

解决方案

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

I'm new to Relay and am having an issue with nested data on a fragment.

The following query returns the correct data when I test in it graphiql so I am confident my schema is correct.

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

However, when I use the above query with Relay the customer.name will be correct but customer.billing_address.city is the same for every customer. It's confusing to me why some of the data would be correct while the nested data would just be copied.

I would appreciate any help with the issue and if anymore information is needed I would be glad to add it. Below is the only Relay code currently in my project and where I believe the issue may be.

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')
);

解决方案

One possible problem could by how you resolve billing_address in your GraphQL schema. Did you include an field :id, !types.ID or globalIdField in your billing_address GraphQL type? Posting your GraphQL schema may also help.

这篇关于嵌套片段数据在中继中始终相同的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！