在其他 class 方法中使用 <Query> 的正确模式

Correct pattern for using <Query> in other class methods

我知道 Apollo 更喜欢我们在渲染方法中使用 <Query> 来进行查询,而不是 this.props.client.query()

我创建的每个新 class,我都从 <Query> 组件开始(以保持最佳实践),但 100% 的时间最终会删除它并只做 this.props.client.query() 在我的 componentWillMount 中,否则基本上所有其他 class 方法都是无用的,因为它无法访问它需要的任何数据。

是否故意让从<Query>组件中获得的任何东西只能在render()中使用?

几乎完全依赖 this.props.client.query() 是反模式吗?如果是这样,我是否应该创建 另一个 组件来放入我的 <Query> 中,这样 componentDidUpdate 之类的东西就不会变得毫无用处?

很抱歉提出所有问题,我很惊讶我以前从未见过有人问过这个问题。

使用client.query的主要原因是它不会观察您的缓存变化。如果信息在缓存中更新(例如,在突变之后),除非重新安装,否则组件中呈现的数据将不会更新。

如果您有一个 class 组件,并且您正在使用 Query 组件并且您需要提供的数据可用于 render 之外的方法,那么是的,您需要有两个组件,以便数据可以作为道具传递。这有效地迫使您使用 container/presenter pattern.

或者您可以只使用 graphql HOC 达到同样的效果。

但是...从 3.0 版开始,render-prop 组件和 HOC 都 deprecated. So in terms of "best practices", you probably want to migrate 无论如何都可以使用功能组件和挂钩。