Relay.Renderer

Relay.Renderer 是一个 Relay.RootContainer 的替代品，它生成一个 Relay.ReadyStateRenderer，并根据给定的 queryConfig 执行数据的获取。 .

概述 #

Props

Props #

Container #

Container: RelayContainer

必须是有效的 RelayContainer。 Relay 将尝试在渲染数据之前满足数据要求。

forceFetch #

forceFetch: boolean

如果提供并设置为true，则始终对服务器进行数据请求，而不管客户端上的数据是否已经可用。

QueryConfig #

queryConfig: RelayRoute

一个 Relay.Route的实例，或是一个有 ame、queries 和可选的 params 属性的对象。

Environment #

environment: 环境

符合Relay.Environment 接口的对象, 如 Relay.Store.

渲染 #

render({
  props: ?{[propName: string]: mixed},
  done: boolean,
  error: ?Error,
  retry: ?Function,
  stale: boolean
}): ?React$Element

如果没有提供 render 回调函数，且数据可用的话，预设的行为是如果有既存的视图就渲染它，如果没有则不渲染东西到容器。

如果回调回传 undefined（例如：当从一个 queryConfig transition 到另一个时），render 先前被渲染的视图 （或如果先前没有视图的话不渲染 任何东西）。

Example #

// In this example, `ErrorComponent` and `LoadingComponent`
// simply display a static error message / loading indicator.
<Relay.Renderer
  Container={ProfilePicture}
  queryConfig={profileRoute}
  environment={Relay.Store}
  render={({done, error, props, retry, stale}) => {
        if (error) {
          return <ErrorComponent />;
        } else if (props) {
          return <ProfilePicture {...props} />;
        } else {
          return <LoadingComponent />;
        }
      }}
/>

onReadyStateChange #

onReadyStateChange(
  readyState: {
    aborted: boolean;
    done: boolean;
    error: ?Error;
    events: Array<ReadyStateEvent>;
    ready: boolean;
    stale: boolean;
  }
): void

这个 callback prop 会在各种数据解析事件发生时被回调。

可以参阅: 准备状态