转换手册

您的继电器经典应用程序在以下步骤中增加现代化：

步骤0：安装Relay v1.0 #

从 入门指南安装最新版本的Relay 。

Step 1: 增量转换为 Relay 兼容 #

开始转换您的组件和突变，从采用 Relay Modern API 'react-relay/compat' 模块(createFragmentContainer, createRefetchContainer, createPaginationContainer, commitMutation)。 从底层组件往上进行会比较容易。这个 转换脚本 应该能使这个步骤不会那么繁琐。

如果片段使用在运行时确定的变量， 请参见下文。

步骤2：介绍 <QueryRenderer> #

一旦所有的组件和 mutation 转换为使用 Relay Modern API，转换为使用 QueryRenderer 而不是使用 Relay.Renderer 或 Relay.RootContainer 。您可以提供 Store 从 'react-relay/classic' 为 environment 大多数情况下。

步骤3：介绍 Relay Modern 运行时 #

一旦您的几个或所有视图正在使用 QueryRenderer, Store 从 'react-relay/classic' 可以替换为 RelayModernEnvironment。请记住， RelayModernEnvironment 并且 Store 不共享任何数据。 您可能想要暂停此步骤，直到具有重要数据重叠的视图可以同时切换。这一步是为您的应用程序解锁以发挥高性能。 使用 RelayModernEvironment 得到的应用程序将持续查询ID（而不是完整的查询字符串）发送到服务器，以及更多优化的数据规范化和处理。

步骤 4: 用 Relay Modern 代替 Relay 来清理 #

将'react-relay/compat' 应用中的引用切换到 'react-relay'. 这更是一个清理步骤，阻止您的应用程序引入不必要 'react-relay/classic' 代码。

注意：在运行时确定变量值 #

目前只有一个支持的方法来设置动态变量的初始值：使用在包括该片段的查询中定义的全局变量（或在 QueryRenderer中通过 variables设置 )。

例如，如果 currentDate 设置了 QueryRenderer variables, 那么 $currentDate 可以在包含QueryRenderer的任何片段中被引用。 query.

如果您正在使用， createRefetchContainer 那么您的 refetch 方法也可能会更新这些变量以使用新的值进行呈现。