React Relay 总是强制获取 Route 或 RelayContainer

Question

是否可以定义中继容器或 <Route/> 在安装时（或之前）始终强制获取？

我可以在 componentDidMount 中执行 this.props.relay.forceFetch()，但它有点难看 + 如果它是初始页面加载则执行两个请求。

Answer 1

像这样定义片段：

export default Relay.createContainer(Component, {
  initialVariables: { show: false },
  fragments: {
    viewer: (): string => Relay.QL`
      fragment on Viewer  {
        messages @include(if: $show) {
           id
        }
      }
    `,
  },
})

然后

componentDidMount() {
    this.props.relay.forceFetch({ show: true })
}

这样组件只会加载一次。并且当你重新安装它时总是会重新获取。请注意，如果这是顶级组件，您可能会出错，因为您没有获取任何数据。我添加了对用户 ID 的请求作为临时 hack，我的 graphql 服务器可以更快地解决它。

Answer 2

一个更优雅的解决方案是使用 Relay.Renderer forceFetch，它会从服务器中提取新数据，而不管组件的当前数据状态如何。它可以像文档中那样与 react-relay-router 一起使用：

<Router
    history={history}
    routes={routes}
    render={applyRouterMiddleware(useRelay)}
    forceFetch={true}
    environment={Relay.Store}
/>

React Relay 总是强制获取 Route 或 RelayContainer

React Relay always force fetch Route or RelayContainer

reactjs

relayjs