How to get current route name in react native using react navigation v5

Question

I just want the name of the current route or screen in react-native which I can use in condtions. I am using react class based component.

Answer 1

Keep a ref of your navigation container and then call getCurrentRoute().name on the reference:

class App {
  navigationRef = null

  render() {
    <NavigationContainer ref={ref => this.navigationRef = ref}>
       .....
    </NavigationContainer>
  }

  getCurrentRouteName() {
    return this.navigationRef.getCurrentRoute().name
  }
}

Source: https://reactnavigation.org/docs/screen-tracking/ (I just converted the function based component syntax into the equivalent class component one)

Answer 2

There's a name property within the route props.

function ProfileScreen({ route }) {
  return (
    <View>
      <Text>This is the profile screen of the app</Text>
      <Text>{route.name}</Text>
    </View>
  );
}

source: https://reactnavigation.org/docs/route-prop