在 App.js 中获取当前路线名称（无法访问导航道具）

Question

在我的 React Native 主文件 (App.js) 中，我有一个 firebase 通知处理程序，在 foregroundNotifications 侦听器中，我想检查当前路由名称，但问题是我无法访问导航道具，这就是为什么我在另一个文件中创建了一个导航引用，然后将其导入 App.js.

在我的RootNavigation.js

import * as React from 'react';

export const isReadyRef = React.createRef();

export const navigationRef = React.createRef();

export function navigate(name, params) {
  if (isReadyRef.current && navigationRef.current) {
    // Perform navigation if the app has mounted
    navigationRef.current.navigate(name, params);
  } else {
    // You can decide what to do if the app hasn't mounted
    // You can ignore this, or add these actions to a queue you can call later
  }
}

这允许我使用导航（在另一个 Whosebug post 之后添加了方法），但是我如何从 NavigationRoot.js 获取当前路由名称？

我如何在 App.js 中使用它（我添加了 navigate，但如何添加 getCurrentRoute？）

import { navigationRef, isReadyRef } from '@env/RootNavigation.js';

RootNavigation.navigate('NewScreen');

<NavigationContainer ref={navigationRef} onReady={ () => { isReadyRef.current = true; } }>
            <ROOTSTACK1></ROOTSTACK1>
</NavigationContainer>

Answer 1

您的 RootNavigation 文件应该像这样 Example。

在 RootNavigation 文件中添加以下函数

function getCurrentRoute(){
  if (navigationRef.isReady()) {
    const route=navigationRef.getCurrentRoute();
    console.log(route);
   // sample output {key:"Home-k2PN5aWMZSKq-6TnLUQNE",name:"Home"}

   return route.name;
  }
}

以及任何您想使用此功能的地方

// any js module
import * as RootNavigation from './path/to/RootNavigation.js';

// ...

RootNavigation.getCurrentRoute();

在 App.js 中获取当前路线名称（无法访问导航道具）

Get current route name in App.js (no access to navigation prop)

javascript

reactjs

react-native