web-dev-qa-db-ja.com

反応ナビゲーションで現在のルート名を取得する方法は?

現在のルートまたはスクリーンの名前を反応ナビゲーションで使いたいので、if条件を変更するために内部で使用します。

13
Eshant Bist

次のコードとしてキャッチできます。

this.props.navigation.state.routeName
22
Hussam Kurd

"react-navigation": "^3.0.8"とDrawerNavigatorを使用しているときに、this.props.activeItemKeyを使用してthis.propsオブジェクトからアクセスできます。

10
Rishabh

ネストされたナビゲーターを使用している場合、このコードを使用して現在のアクティブな画面の状態を取得できます

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);
}

使用法:

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

NavigationDrawerから現在アクティブな画面の状態を取得する必要があるときに、これを使用しています。

9

TabNavigatorに複数のBottomTabNavigatorsがネストされています。 TabNavigatorの現在のルートを取得するには:

    const pathAndParams = props.navigation.router.getPathAndParamsForState(props.navigation.state) || {}
    const activePath = pathAndParams.path
1
Areg