Comment obtenir le nom actuel de l'itinéraire dans React-Navigation?

Question

Je veux le nom de la route ou de l'écran actuel dans react-navigation que je veux utiliser à l'intérieur si condition pour apporter des modifications.

Answer 1

Pour react-navigation v5:

 import {useRoute} from '@react-navigation/native';

const route = useRoute();
console.log(route.name);

Answer 2

Vous pouvez l'attraper comme le code suivant:

 this.props.navigation.state.routeName

Answer 3

Si vous utilisez des navigateurs imbriqués, vous pouvez utiliser ce code pour obtenir l'état actuel de l'écran actif

 import { NavigationState } from 'react-navigation';

const getActiveRouteState = function (route: NavigationState): NavigationState {
    if (!route.routes || route.routes.length === 0 || route.index >= route.routes.length) {
        return route;
    }

    const childActiveRoute = route.routes[route.index] as NavigationState;
    return getActiveRouteState(childActiveRoute);
}

Usage:

 const activeRoute = getActiveRouteState(this.props.navigation.state);

J'utilise ceci lorsque j'ai besoin d'obtenir l'état actuel de l'écran actif à partir de NavigationDrawer.

Answer 4

Cela fonctionne bien dans react-navigation v5.x

 this.props.route.name

Answer 5

Tout en utilisant "react-navigation": "^3.0.8" et DrawerNavigator, il est accessible à partir de l'objet this.props en utilisant this.props.activeItemKey