How to pass navigation prop to child component in react navigation v5

Question

How to pass navigation prop to child component in react native, I am using react navigation v5, as I want to use navigation.navigate('settings') in the child component.

Answer 1

You can use useNavigation in your child component.

Example (adapted from the docs):

import React from 'react';
import { Button } from 'react-native';
import { useNavigation } from '@react-navigation/native';

function MyBackButton() {
  const navigation = useNavigation();

  return (
    <Button
      title="Go to Settings"
      onPress={() => {
        navigation.navigate('settings');
      }}
    />
  );
}