Знаете, какой текущий маршрут находится в компоненте вне стекового навигатора с React Navigation?

Question

У меня есть компонент, который находится внутри компонента NavigationContainer, но за пределами Stack Navigator. Могу ли я узнать, какой текущий маршрут находится внутри компонента? Я не могу использовать хук useRoute, так как он выдает ошибки:

Не удалось найти объект маршрута. Ваш компонент находится внутри экрана в навигаторе?

Answer 1

Вы должны будете следовать этому руководству из react-navigation документов . В нем объясняется, как получить доступ к NavigationContainer ref, который затем можно использовать для доступа к текущему состоянию навигации вашего приложения, даже вне компонентов.

Вот короткая демонстрационная программа на случай разрыва этой ссылки в будущем.

// App.js

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

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

// Navigation.js

import React from 'react';

export const navigationRef = React.createRef();

// You can export navigation functions to use throughout your app, without accessing the `navigation` prop.
export function navigate(name, params) {
  navigationRef.current?.navigate(name, params);
}

// This is the function you want, it will return the complete navigation state
export function getRootState() {
  return navigationRef.current?.getRootState();
}