使用中继环境的突变

Question

我正在使用Relay与React Native并在登录和注销期间遇到问题。

登录或注销后，Relay会将商店与之前的用户保持一致。 为了解决这个问题，我使用了Relay.Renderer和Relay.Environment 。 就像在每个Renderer我放置Environment单个对象。

问题是，我以前做了一个突变的对象Relay.Store ，如Relay.Store.commitUpdate(new CreateProfile(), callback) 。

现在它不起作用。 我想这是因为Relay.Store对服务器端点一无所知。 但是Relay.Environment确实如此。

现在我正在使用这样的东西this.props.relay.commitUpdate(new CreateProfile(), callback) 。 当父组件被包装为Relay.Container ，它工作得很好，所以它在props中有中继对象。

但是，我应该在不是Relay.Containers组件中做什么，并且在道具中没有Relay对象？

Answer 1

Relay.Store是全球可访问的单一实例Relay.Environment和Relay.Store.commitUpdate()在全球环境的更新数据。 但是，由于您正在使用自己的Relay.Environment实例，要更新它，您需要使用this.props.relay.commitUpdate() ，如您所述。 这会更新容器呈现的环境。

如果需要从容器的子组件进行突变 ，而这些组件未包含在Relay.Container ，则有两种方法可以做到这一点。 您可以简单地将relay道具传递给它们，因此在容器的渲染功能中，您将拥有：

<Child relay={this.props.relay} />

但是，由于这些普通组件不在Relay容器中，因此它们目前不需要了解有关Relay的任何信息。 如果你想保持这种方式，你可以编写在容器组件中执行更新的方法，如下所示：

onCreateProfile = () => {
  this.props.relay.commitUpdate(new CreateProfile());
};

并且只在render中将回调传递给子组件：

<Child onCreateProfile={this.onCreateProfile} />

如果你需要从组件层次结构中没有Relay.Container的组件中进行变异 ，你可以在更高的共享根组件中创建Relay.Environment并使用props传递它（或传递使用上面显示的策略进行回调。