title: react-native get current route name
body: <p>This is a "share your knowledge" post. I need this feature and searched many hours for it so i share my solution. Feel free to post CC.</p>
  
  <p><strong>How to get the current route name from main App in react native ?</strong> </p>
  
  <p>EDIT : THIS IS FOR react-navigation V1 </p>
  
  <p>( knowing that we cannot use this.props.navigation inside it because it define TabNavigator and StackNavigator itself ) </p>
  
  <pre><code>/** the trick is with DeviceEventEmitter **/
  import { DeviceEventEmitter } from 'react-native';
  const initialRouteName = "FluxObservations";
  
  
  const MyTabView = TabNavigator(
    {
      FluxObservations: { screen: FluxObservations },
      Projects: { screen: Projects },
      NewObservation: { screen: NewObservation},
      Explorer: { screen: Explorer },
      Profil: { screen: Profil }
    },
    {
      swipeEnabled: false,
      initialRouteName: initialRouteName,
      tabBarPosition: "bottom",
      tabBarOptions: { ... },
      navigationOptions: {
        tabBarOnPress: ({ previousScene, scene, jumpToIndex }) =&gt; {
          //On each tab change we inject event
          DeviceEventEmitter.emit('updateCurrentRouteName', { currentRouteName: scene.route.routeName });
          // Keep original behaviour
          jumpToIndex(scene.index)
        }
      }
    }
  );
  
  const StackView = StackNavigator(
    {
      global: {
        screen: MyTabView,
        headerMode: "none",
        header: null,
        navigationOptions: {
          header: null
        }
      },     
      Credits: { screen: Credits },
      Floristic: { screen: Floristic },
      TermsOfUse: { screen: TermsOfUse },
      LegalNotice: { screen: LegalNotice },
      Options: { screen: Options },
    },
    {mode: 'modal'}
  );
  
  export default class App extends React.PureComponent {
    constructor (props) {
      super(props);
      // emit the event for the first tab opened by default, initialRouteName
      DeviceEventEmitter.emit('updateCurrentRouteName', { currentRouteName: initialRouteName });
    }
  
  
    // catching all event for route name change ! 
    listeners = {
      update: DeviceEventEmitter.addListener('updateCurrentRouteName', ({ ...currentRouteName }) =&gt; {
        console.log("MAIN ", currentRouteName) // Perform update
      })
    }
  
  
    render() {
      return (
        &lt;Provider store={store}&gt;
          &lt;PersistGate
            loading={&lt;ActivityIndicator /&gt;}
            persistor={persistor}&gt;
            &lt;View style={styles.fullScreen}&gt;
              &lt;StackView /&gt;
            &lt;/View&gt;
          &lt;/PersistGate&gt;
        &lt;/Provider&gt;
      );
    }
  }
  </code></pre>
  
  <p>I need this to show tutorial modal on each TabNavigator Screen each time user click on them (until he click "i get it") </p>