跳至主要内容

RootTag

RootTag 是分配给 React Native 表面（即 Android 或 iOS 的 ReactRootView 或 RCTRootView 实例）的原生根视图的不透明标识符。简而言之，它是一个表面标识符。

何时使用 RootTag？​

对于大多数 React Native 开发人员来说，您可能不需要处理 RootTag。

当应用程序渲染**多个 React Native 根视图**并且需要根据表面以不同的方式处理原生 API 调用时，RootTag 很有用。例如，当应用程序使用原生导航并且每个屏幕都是一个单独的 React Native 根视图时。

在原生导航中，每个 React Native 根视图都渲染在平台的导航视图中（例如，Android 的 Activity、iOS 的 UINavigationViewController）。通过此，您可以利用平台的导航范例，例如原生外观和导航过渡。与原生导航 API 交互的功能可以通过原生模块公开给 React Native。

例如，要更新屏幕的标题栏，您将调用导航模块的 API setTitle("Updated Title")，但它需要知道要更新堆栈中的哪个屏幕。此处需要 RootTag 来识别根视图及其托管容器。

RootTag 的另一个用例是，当您的应用程序需要根据其源根视图将特定的 JavaScript 调用归因于原生时。RootTag 对于区分来自不同表面的调用的来源是必要的。

如何访问 RootTag... 如果您需要它​

在 0.65 及以下版本中，可以通过旧版上下文访问 RootTag。为了为 React 18 及更高版本中即将推出的并发功能做好准备，我们正在迁移到最新的Context API（通过 0.66 中的 RootTagContext）。版本 0.65 支持旧版上下文和推荐的 RootTagContext，以便开发人员有时间迁移其调用站点。请参阅重大更改摘要。

如何通过 RootTagContext 访问 RootTag。

import {RootTagContext} from 'react-native';
import NativeAnalytics from 'native-analytics';
import NativeNavigation from 'native-navigation';

function ScreenA() {
  const rootTag = useContext(RootTagContext);

  const updateTitle = title => {
    NativeNavigation.setTitle(rootTag, title);
  };

  const handleOneEvent = () => {
    NativeAnalytics.logEvent(rootTag, 'one_event');
  };

  // ...
}

class ScreenB extends React.Component {
  static contextType: typeof RootTagContext = RootTagContext;

  updateTitle(title) {
    NativeNavigation.setTitle(this.context, title);
  }

  handleOneEvent() {
    NativeAnalytics.logEvent(this.context, 'one_event');
  }

  // ...
}

从 React 文档中了解有关类和钩子的 Context API 的更多信息。

0.65 中的重大更改​

RootTagContext 以前名为 unstable_RootTagContext，并在 0.65 中更改为 RootTagContext。请更新代码库中 unstable_RootTagContext 的任何用法。

0.66 中的重大更改​

将删除对 RootTag 的旧版上下文访问，并替换为 RootTagContext。从 0.65 开始，我们鼓励开发人员主动将 RootTag 访问迁移到 RootTagContext。

未来计划​

随着新的 React Native 架构的进展，RootTag 将会有未来的迭代，目的是保持 RootTag 类型不透明并防止 React Native 代码库出现混乱。请不要依赖 RootTag 当前与数字别名的事实！如果您的应用程序依赖于 RootTag，请关注我们的版本更改日志，您可以在此处找到。