时间戳

首页 > 解决方案 > 如何在根反应导航器之外获取反应导航器状态？

javascript - 如何在根反应导航器之外获取反应导航器状态？

问题描述

事情就是这样：
我在移动设备上有一个 react-native 应用程序，当用户离开我的应用程序并返回时，我正在尝试执行一些权限检查操作。我想避免在登录屏幕上进行权限检查并考虑到现有的应用程序组件树，我想获取当前路由供我使用。现在，我使用的是5.x版本的 react-navigation。


const App = () => {
  useEffect(() => {
    const handleAppStateChange = (): void => {
      // Authority check action
    };
    AppState.addEventListener('change', handleAppStateChange);
  }, []);

  return (
    <Provider store={store}>
      <SafeAreaProvider>
        <SafeAreaView>
          <RootNavigator />
          <OverlayActivityIndicator />
          <ActionSheet />
        </SafeAreaView>
      </SafeAreaProvider>
    </Provider>
  );
}

现在我遇到了问题：
我不知道如何在根导航器之外获取当前路线。

我最后的选择是将当前路由集成到 redux 存储中，这将使我的应用程序更加复杂。

还有其他想法吗？

标签： javascriptreactjsreact-nativemobilereact-navigation

解决方案

您可以参考此内容以获取组件外部的导航

import { NavigationContainer } from '@react-navigation/native';
import { navigationRef } from './RootNavigation';

export default function App() {
  return (
    <NavigationContainer ref={navigationRef}>{/* ... */}</NavigationContainer>
  );
}


//whereas 
import * as React from 'react';

export const navigationRef = React.createRef();

export function navigate(name, params) {
  navigationRef.current?.navigate(name, params);
}

推荐阅读