DEV Community

Emmanuel Oreoluwa
Emmanuel Oreoluwa

Posted on • Originally published at Medium on

React Navigation and StackNavigator to navigate Error

I am trying to use React Navigation and StackNavigator to navigate around my app. I have a picture with onPress={() => navigate(โ€˜Swipe Screenโ€™), and I was hoping that would take me to the Swipe Screen, it was clicking but not navigating What do I need to add in order to get this working?

I already added navigation={this.props.navigation} to the parent Component

below https://gist.github.com/AORECLAUSE/1aa6927877fcbd3901b19e35a15bb6df/revisions

Top comments (2)

Collapse
 
bartmr profile image
Bartmr • Edited

I didn't understand your Gist, but it's possible that your nested navigators aren't connected in a consistent tree where navigator screens are composed of more navigators using createStackNavigator or others. Example:

WRONG way:

RootNavigator {
--Screen1: React Component which renders a navigator {
----NestedScreen1,
----NestedScreen2
--},
--Screen2: React Component
}

RIGHT way:

RootNavigator {
--Screen1: createStackNavigator({
----NestedScreen1: ReactComponent,
----NestedScreen2: createTabNavigator(
------SuperNestedScreen1: React Component
------SuperNestedScreen2: React Component
----)
--}),
--Screen2: React Component
}


You can create a React Component that IS a navigator at the same time, but that's described in the docs. Happy Coding. React Native really rocks.

Collapse
 
santima10 profile image
Santiago M.A.

Can you create an expo snack? It would be easier to help