withNavigation can only be used on a view hierarchy of a navigator
In react-navigation, the main StackNavigator creates a context provider and the navigation
prop will be made available to any component below its level in the component tree if they use the context consumer.
Two ways to access the navigation
prop using context consumer is to either add the component to the StackNavigator, or use the withNavigation
function. However because of how React's context API works, any component that uses withNavigation
function must be below the StackNavigator in the component tree.
If you still want to access the navigation
prop regardless of the position in component tree, you will have to store the ref to the StackNavigator in a module. Following guide from react-navigation will help you do that https://reactnavigation.org/docs/en/navigating-without-navigation-prop.html
If you are using react-navigation version 5, use useNavigation hook with a functional component. This hook injects the navigation object into the functional component. Here is the link to the docs:
https://reactnavigation.org/docs/use-navigation/