Ammar Tariq
Ammar Tariq

Reputation: 847

React navigation weird back button and pop behavior

I have a nested navigator in my react native App

cost Main = createTabNavigator({
  Home:Home,
  Challenge:Challenge,
  Products:Products,
  Options:Options
})
const Options = createStackNavigator({
  OptionsScree:OptionsScreen,
  Details:Details,
  Profile:Profile
})

I can navigate from Home screen to Details by simply doing this.props.navigationnavigate('Details')

but when I'm doing this.props.navigation.pop() it is supposed to take me to last focused screen which was Home screen but it takes me to OptionsScreen is there a way to go back to Home ?

Upvotes: 1

Views: 473

Answers (1)

ehsan
ehsan

Reputation: 522

Try moving Main tab navigator component into stack navigator as below.

const Options = createStackNavigator({
  Main:Main,
  OptionsScree:OptionsScreen,
  Details:Details,
  Profile:Profile
})

As Home screen is not present in stack, this.props.navigation.pop() can not pop that screen for you. It pops previous screen in the stack, if none pops the first screen which is in your case is OptionsScreen.

Upvotes: 2

Related Questions