8

I am building an app whose navigation is based on a DrawerNavigator from the react-navigation library.

This navigator has 3 tabs:

  • 2 regular tabs
  • 1 StackNavigator named "Search"

The StackNavigator consists of one screen that lets the user search for an item, and a second screen where the user sees the search results.

I do not want the search results page to be a tab of a DrawerNavigator, this is why I implemented this structure.

The problem is: if the user has already performed a search, when he clicks on the "Search" tab, he does not come back to the search screen but to the search results screen. I would prefer that the user comes back to the search screen.

How can I achieve that?

Arnaud
  • 4,884
  • 17
  • 54
  • 85

2 Answers2

2

You can achive this using navigation dispatch with navigationActions

import { NavigationActions } from 'react-navigation';

const resetAction = NavigationActions.reset({
  index: 0,
  actions: [
    NavigationActions.navigate({
      routeName: 'DrawerScreen',
      params: {},
      action: NavigationActions.navigate({ routeName: 'SearchScreen' }),
    }),
  ],
})
navigation.dispatch(resetAction)
Masood
  • 1,545
  • 1
  • 19
  • 30
Tarek Salah uddin Mahmud
  • 924
  • 8
  • 18
  • For this I need to catch the click event on the Search tab in the DrawerNavigator. Do you know how can I catch this event? – Arnaud Jun 20 '17 at 13:59
  • Please have a look at this link https://stackoverflow.com/questions/44801667/navigate-to-root-screen-from-nested-stack-navigator?noredirect=1#comment76584210_44801667 – user2028 Jun 29 '17 at 11:06
1
import { NavigationActions } from 'react-navigation';

const resetAction = NavigationActions.reset({
  index: 0,
  actions: [
      NavigationActions.navigate({ routeName: 'SearchScreen'})
  ]
})

Here in your button or any element with event add this: this.props.navigation.dispatch(resetAction)

<Button
    onPress= {
        () => this.props.navigation.dispatch(resetAction)
    }
    title='Back to Search'
/>
Masood
  • 1,545
  • 1
  • 19
  • 30