title: TypeError: props.navigation.getParam is not a function. (In 'props.navigation.getParam('docId')', 'props.navigation.getParam' is undefined)
body: <p>I am trying to fetch the data from one screen to another through props.naviagtion.getParam, however I am getting this error :'TypeError: props.navigation.getParam is not a function. (In 'props.navigation.getParam('docId')', 'props.navigation.getParam' is undefined)'.
  I have shared the code; if someone is familiar with the problem, your help will be appreciated!</p>
  <pre><code>import { useNavigation } from '@react-navigation/core'
  import React from 'react'
  import { StyleSheet, Text, TouchableOpacity, View, FlatList, ScrollView, Pressable } from 'react-native'
  import { auth } from '../firebase'
  import { DOC } from '../Data/dummy-data'
  
  
  
  
  
  const HomeScreen = props =&gt; {
    const navigation = useNavigation()
  
    const handleSignOut = () =&gt; {
      auth
        .signOut()
        .then(() =&gt; {
          navigation.replace(&quot;Login&quot;)
        })
        .catch(error =&gt; alert(error.message))
    }
  
    const renderGridItem = (itemData) =&gt; {
      return ( 
        &lt;TouchableOpacity 
        style={styles.grid}
        onPress={ () =&gt; { 
          navigation.navigate('Doctors',{docId:itemData.item.id})
          
    }}&gt;
      &lt;View&gt;
        &lt;Text&gt;
          {itemData.item.title}
        &lt;/Text&gt;
      &lt;/View&gt;
      &lt;/TouchableOpacity&gt;
      )
    }
  
    return (
      &lt;View style={styles.container}&gt;
  
        
      
  
        &lt;FlatList keyExtractor={(item, index) =&gt; item.id} 
        data={DOC} 
        renderItem={renderGridItem} /&gt;
  
        &lt;Text style={styles.txt}&gt;Email: {auth.currentUser?.email}&lt;/Text&gt;
        &lt;TouchableOpacity
          onPress={handleSignOut}
          style={styles.button}
        &gt;
          &lt;Text style={styles.buttonText}&gt;Sign out&lt;/Text&gt;
        &lt;/TouchableOpacity&gt;
  
        
      &lt;/View&gt;
    )
  }
  
  
  HomeScreen.navigationOptions = {
    headerTitle: 'All Doctors',
    headerStyle: {
      backgroundColor: 'red'
    },
    headerTintColor: 'red'
  };
  
  export default HomeScreen
  
  
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: 'center',
      alignItems: 'center',
      
    },
     button: {
      backgroundColor: '#0782F9',
      width: '60%',
      padding: 15,
      borderRadius: 10,
      alignItems: 'center',
      marginTop: 40,
    },
    buttonText: {
      color: 'white',
      fontWeight: '700',
      fontSize: 16,
    },
    txt:{
      fontSize:20,
      color:'black',
      alignItems:'flex-start'
    },
    screen:{
      marginTop:10,
      width:'30%',
      height:2,
      borderRadius:10,
      backgroundColor:'red',
      
    },
    grid:{
      flex:1,
      margin:15,
      height:150
    },
  })
  </code></pre>
  <p>/////////////Doctor.js//////////////</p>
  <pre><code>import { StyleSheet, Text, View } from 'react-native'
  import React from 'react'
  import { DOC } from '../Data/dummy-data'
  
  const Doctors = props =&gt; {
    const docId = props.navigation.getParam('docId')
    const selectedCategory = DOC.find(doc =&gt; doc.id === docId)
    return (
      &lt;View&gt;
        &lt;Text&gt;{selectedCategory.title}&lt;/Text&gt;
      &lt;/View&gt;
    )
  }
  
  export default Doctors
  
  const styles = StyleSheet.create({})
  </code></pre>