NavigationEvents reference

NavigationEvents is a React component providing a declarative API to subscribe to navigation events. It will subscribe to navigation events on mount, and unsubscribe on unmount.

Component props

• navigation - navigation props (optional, defaults to reading from React context)
• onWillFocus - event listener
• onDidFocus - event listener
• onWillBlur - event listener
• onDidBlur - event listener

The event listener is the same as the imperative navigation.addListener(...) API.

Example

import React from 'react';
import { View } from 'react-native';
import { NavigationEvents } from 'react-navigation';

const MyScreen = () => (
  <View>
    <NavigationEvents
      onWillFocus={(payload) => console.log('will focus', payload)}
      onDidFocus={(payload) => console.log('did focus', payload)}
      onWillBlur={(payload) => console.log('will blur', payload)}
      onDidBlur={(payload) => console.log('did blur', payload)}
    />
    {/*
      Your view code
    */}
  </View>
);

export default MyScreen;