function Screen2({route, navigation}) {
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<Text>{route.params.myText}</Text>
</View>
);
}
export default Screen2;
Here myText is a string that is passed from other screen(login Screen).
login Screen---------------------------------------
<View>
<Button style={styles.loginBTN} title="Login"
onPress={() => {navigation.navigate('Screen2'), {myText: "hello react-native"}}} />
</View>
I guess there's a situation (maybe before unmounting) that route or route.params is undefined,
you can solve it this way
function Screen2({route, navigation}) {
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
//I added question mark before the dots (optional chaining)
<Text>{route?.params?.myText}</Text>
</View>
);
}
export default Screen2;
it's called optional chaining, according to Mozilla
It enables you to read the value of a property located deep within a chain of connected objects without having to check that each reference in the chain is valid.
your login button press should pass the params like below
onPress={() = navigation.navigate("Screen2", {
myText: "hello react-native",
})
}