The computer has come to shape our world and the universe. It is so important that we cannot do without this fantastic invention. You would have heard about networking before. Networking is all about connection, the concept of networking can be applied to every facet of human life. It refers to a computer as well.

Navigation.navigate() is not redirecting and throwing error

Anil

I have a react native application and I use navigation.navigate throughout the application but in one case where I use it, it is not working and I am not sure why. I have an idea but I dont know how to fix it.

I have a component called ConnectAgentComponent. I have a touchableopacity view and when a user clicks on it, I want to redirect to a different screen. I am grabbing navigation from the props of the component. I then want it call navigation.navigate('ContactScreen', {zpid, zpid})

I think what is happening is that it is expecting me to pass in navigation from the parent component. When i call it from other components after grabbing it from the props part of the component, it works...

Does anyone know how to fix this issue.

Code:

const ContactAgentComponent = ({property, navigation}) => {

  const propertyAddress = property.address.streetAddress + ', ' + property.address.city +
    ', ' + property.address.state + ' ' + property.address.zipcode

  const collectionRef = collection(db, 'Emails')

  useEffect(() => {
    console.log(navigation)
  }, [navigation])

  const contactScreen = (zpid) => {
    navigation.navigate('ContactAgentStack', {zpid: zpid})
  }

  return (
    <View style={styles.container}>
      <View style={styles.connect}>
        <Text style={styles.header}>Connect With An Agent</Text>
      </View>
      <View style={styles.messageContainer}>
        <Text style={styles.message}>Interested in the property above, connect with one of our agents that will be able to assist you!</Text>
      </View>
      <View>
        <View style={styles.infoContainer}>
          <Image style={{height: 80, width: 80}} source={{uri: 'https://img.freepik.com/free-photo/portrait-white-man-isolated_53876-40306.jpg?w=2000'}}/>
          <View style={styles.contactContainer}>
            <Text style={styles.label}>Omar Jandali</Text>
            <Text style={styles.label}>DRE# 02151051</Text>
            <Text style={styles.label}>Realty One Group</Text>
            <Text style={styles.label}>DRE# 0896421</Text>
          </View>
        </View>
      </View>
      <TouchableOpacity onPress={() => {contactScreen(property.zpid)}}>
        <View style={styles.buttoncontainer}>
          <Text style={styles.button}>Connect With Agent</Text>
        </View>
      </TouchableOpacity>
    </View>
  )
}