RootTag

RootTag is an opaque identifier assigned to the native root view of your React Native surface — i.e. the ReactRootView or RCTRootView instance for Android or iOS respectively. In short, it is a surface identifier.

When to use a RootTag?

For most React Native developers, you likely won’t need to deal with RootTags.

RootTags are useful for when an app renders multiple React Native root views and you need to handle native API calls differently depending on the surface. An example of this is when an app is using native navigation and each screen is a separate React Native root view.

In native navigation, every React Native root view is rendered in a platform’s navigation view. By this, you are able to leverage the navigation paradigms of the platform such as native look and feel and navigation transitions. The functionality to interact with the native navigation APIs can be exposed to React Native via a native module.

For example, to update the title bar of a screen, you would call the navigation module’s API setTitle("Updated Title"), but it would need to know which screen in the stack to update. A RootTag is necessary here to identify the root view and its hosting container.

Another use case for RootTag is when your app needs to attribute a certain JavaScript call to native based on its originating root view. A RootTag is necessary to differentiate the source of the call from different surfaces.

How to access the RootTag… if you need it

How to access RootTag via the RootTagContext.

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');
  }

  // ...
}

Learn more about the Context API for classes and hooks from the React docs.

Last updated: Sep 30, 2025