Question

假设我在GraphQL架构的顶层定义了一个名为country的字段。我可以通过以下方式查询它：

query {
  country(alpha2: "gb") {
    name
  }
}

在我的中继容器中，我可以使用Country上的片段指定我想要返回的属性：

export default Relay.createContainer(CountryComponent, {
  fragments: {
    country: () => Relay.QL`
      fragment on Country {
        name
      }
    `
  }
}

如何从反应组件中更改alpha2参数的值？我可以将country字段嵌套在某个任意字段下，并在父节点上声明我的中继片段，但如果可能的话，我宁愿避免不必要地修改我的图形。

Answer 1

一般来说，我们认为像这样的顶级参数是路线上的参数。将它们视为流入React应用程序根目录的道具。

如果我想用新道具重新绘制React应用程序，我只需使用新道具再次渲染它：

java.util.ArrayList

如果国家/地区代码是ReactDOM.render(<App countryCode="gb" />, …); // …time passes; country changes ReactDOM.render(<App countryCode="ca" />, …);参数：

Relay.Route

我可以做类似的事情：

class CountryRoute extends Relay.Route {
  static queries = {
    country: () => Relay.QL`
      query { country(alpha2: $countryCode) }
    `,
  };
  static paramDefinitions = {
    countryCode: {required: true},
  };
  static routeName = 'CountryRoute';
}

至于如何以及何时使用新路由参数重新渲染，您可以从React组件触发自定义事件，并使用关联的侦听器再次调用ReactDOM.render( <Relay.RootContainer Component={CountryComponent} route={new CountryRoute({countryCode: 'gb'})} />, … ); // …time passes; country changes ReactDOM.render( <Relay.RootContainer Component={CountryComponent} route={new CountryRoute({countryCode: 'ca'})} />, … );，但是因为您正在使用{ {1}}，您可以考虑简单地更改网址中的国家/地区代码，然后让它使用新的ReactDOM.render参数重新触发路由。

另请参阅：http://facebook.github.io/relay/docs/guides-routes.html#routes-and-queries

将参数传递到Relay容器中的顶级字段

1 个答案: