Expo

useEvent(eventEmitter, eventName, initialValue)

React hook that listens to events emitted by the given object. The returned value is an event parameter that gets updated whenever a new event is dispatched.

import { useEvent } from 'expo';
import { VideoPlayer } from 'expo-video';

export function PlayerStatus({ videoPlayer }: { videoPlayer: VideoPlayer }) {
  const { status } = useEvent(videoPlayer, 'statusChange', { status: videoPlayer.status });

  return <Text>{`Player status: ${status}`}</Text>;
}

useEventListener(eventEmitter, eventName, listener)

React hook that listens to events emitted by the given object and calls the listener function whenever a new event is dispatched. The event listener is automatically added during the first render and removed when the component unmounts.

import { useEventListener } from 'expo';
import { useVideoPlayer, VideoView } from 'expo-video';

export function VideoPlayerView() {
  const player = useVideoPlayer(videoSource);

  useEventListener(player, 'playingChange', ({ isPlaying }) => {
    console.log('Player is playing:', isPlaying);
  });

  return <VideoView player={player} />;
}

EventEmitter

A class that provides a consistent API for emitting and listening to events. It shares many concepts with other emitter APIs, such as Node's EventEmitter and fbemitter. When the event is emitted, all of the functions attached to that specific event are called synchronously. Any values returned by the called listeners are ignored and discarded. Its implementation is written in C++ and common for all the platforms.

EventEmitter Methods

NativeModule

Type: Class extends EventEmitter<TEventsMap>

A class for all native modules. Extends the EventEmitter class.

SharedObject

Type: Class extends EventEmitter<TEventsMap> implements EventEmitter<TEventsMap>

Base class for all shared objects that extends the EventEmitter class. The implementation is written in C++, installed through JSI and common for mobile platforms.

SharedObject Methods

SharedRef

Type: Class extends SharedObject<TEventsMap> implements SharedObject<TEventsMap>

A SharedObject that holds a reference to any native object. Allows passing references to native instances among different independent libraries.

For instance, ImageRef from expo-image references a Drawable on Android and an UIImage on iOS. Since both types are common on these platforms, different native modules can use them without depending on each other. In particular, this enables the expo-image-manipulator to pass the resulted image directly to the image view from expo-image without any additional writes and reads from the file system.

SharedRef Properties

isRunningInExpoGo()

Returns a boolean value whether the app is running in Expo Go.

registerRootComponent(component)

Sets the initial React component to render natively in the app's root React Native view on Android, iOS, tvOS and the web.

This method does the following:

• Invokes React Native's AppRegistry.registerComponent.
• Invokes React Native web's AppRegistry.runApplication on web to render to the root index.html file.
• Polyfills the process.nextTick function globally.

This method also adds the following dev-only features that are removed in production bundles.

• Adds the Fast Refresh and bundle splitting indicator to the app.
• Asserts if the expo-updates package is misconfigured.
• Asserts if react-native is not aliased to react-native-web when running in the browser.

registerWebModule(moduleImplementation)

Registers a web module.

reloadAppAsync(reason)

Reloads the app. This method works for both release and debug builds.

Unlike Updates.reloadAsync(), this function does not use a new update even if one is available. It only reloads the app using the same JavaScript bundle that is currently running.

requireNativeModule(moduleName)

Imports the native module registered with given name. In the first place it tries to load the module installed through the JSI host object and then falls back to the bridge proxy module. Notice that the modules loaded from the proxy may not support some features like synchronous functions.

requireNativeView(viewName)

A drop-in replacement for requireNativeComponent.

requireOptionalNativeModule(moduleName)

Imports the native module registered with the given name. The same as requireNativeModule, but returns null when the module cannot be found instead of throwing an error.

useEventListener(eventEmitter, eventName, listener)

React hook that listens to events emitted by the given object and calls the listener function whenever a new event is dispatched. The event listener is automatically added during the first render and removed when the component unmounts.

import { useEventListener } from 'expo';
import { useVideoPlayer, VideoView } from 'expo-video';

export function VideoPlayerView() {
  const player = useVideoPlayer(videoSource);

  useEventListener(player, 'playingChange', ({ isPlaying }) => {
    console.log('Player is playing:', isPlaying);
  });

  return <VideoView player={player} />;
}