Returning stackNavigator from onPress function in TouchableOpacity
I’ve been working on my first React-Native project lately. I’m having two buttons the Splash Screen through which I want to have an individual Stack navigator according to the chosen choice.
APP.JS
export default createAppContainer( createSwitchNavigator( { SplashScreen: Splash }, { initialRouteName: "SplashScreen" } ) );
Splash Screen
export default function Splash(props) { // const onPress = () => Alert.alert('Left button pressed'); const { navigation } = props; return ( <View style={globalStyles.container}> <Image style={globalStyles.tinyLogo} source={require("../icons/Logo.png")} /> <Text style={globalStyles.logoText}>Move&Queue</Text> <SomethingOneButton /> <SomethingTwoButton /> </View> ); }
SomethingOneButton.JS
export default function SomethingOneButton() { const pressHandler = () => { <SomethingOneButtonStackNavigator />; }; return ( <TouchableOpacity onPress={pressHandler} style={globalStyles.appButtonContainerCustomer} > <Text style={globalStyles.appButtonText}>Customer</Text> </TouchableOpacity> ); }
I’m wanting the both buttons to redirect to first screens in their stack navigators. While debugging after compiling and running the App, I came to know that both the Stack Navigators of both the buttons are already executed due to which these 2 buttons aren’t working. I’m seeking out an approach in order to accomplish this. Thanks in advance.