StackNavigator reopens screen with goBack() + navigate()

[mikeboy91]

Current Behavior

I have a StackNavigator with 3 screens. HomeTabs (includes a TabNavigator), FeedbackForm and QRScanner (with react-native-camera). When QRScanner detects a QR code, I close the screen with navigation.goBack() and navigate to FeedbackForm with navigation.navigate('FeedbackForm').
By doing so, it reopens and closes QRScanner.

This is my StackNavigator:

export const HomeStack = StackNavigator({
  HomeTabs: {
    screen: HomeTabs,
    navigationOptions: {
      title: strings.titleHome,
      headerStyle: navigatorStyles.toolbar,
      headerTitleStyle: navigatorStyles.title,
    },
  },
  FeedbackForm: {
    screen: FeedbackFormContainer,
    navigationOptions: {
      title: 'Give Feedback',
      headerStyle: navigatorStyles.toolbar,
      headerTitleStyle: navigatorStyles.title,
    }
  },
  QRScanner: {
    screen: QRScannerContainer,
    navigationOptions: {
      title: 'QR Scanner',
      headerStyle: navigatorStyles.toolbar,
      headerTitleStyle: navigatorStyles.title,
    }
  },
}, {
  headerMode: 'screen',
});

And this are my logged messages with explanation:

open camera   <-- when i click on the button to start QRScanner from HomeTabs (navigation.navigate('QRScanner'))
camera started   <-- from the constructor of QRScanner
process barcode   <--- QRScanner found a QR code and processes it. At the end of the function I call navigation.goBack() and navigation.navigate('FeedbackForm')
close camera   <--- from QRScanner's componentWillUnmount()
camera started   <--- again from the constructor. Why is QRScanner started again?
close camera   <--- and closes itself after a short amount of time?

After that, FeedbackForm is visible and QRScanner is closed.
Using navigator.goBack() works but I obviously land at HomeTabs.
Using navigator.navigate('FeedbackForm') works aswell but QRScanner remains open which is not what I want. This only happens in combination of these 2 methods.

// in QRScanner

_handleBarCode = (event) => {
    // do the QR code stuff

    this.props.navigation.goBack();
    this.props.navigation.navigate('FeedbackForm');
}

Expected Behavior

I want to go from HomeTabs to QRScanner, close the QRScanner on the QR code detection and navigate directly to FeedbackForm. Later I also need to navigate from HomeTabs to FeedbackForm.

HomeTabs -> QRScanner OR HomeTabs -> FeedbackForm
QRScanner -> FeedbackForm OR QRScanner -> HomeTabs with the Back-Button
FeedbackForm -> HomeTabs with the Back-Button

Your Environment

I am running and debugging on a real device. Google Nexus 5X with Android 7.1.2.
My OS is a Kubuntu 16.04 LTS 64bit.

software	version
react-navigation	1.0.0-beta.9
react-native	0.43.4
node	v7.9.0
npm or yarn	npm v4.2.0

[13860120868]

I guess "replace" is what your want in your case
You probably can do some hack of getStateForAction by following this video: https://www.youtube.com/watch?v=-XULdsZWowU

[mikeboy91]

Thx for the hint. I got my expected behavior with this

this.props.navigation.dispatch(new NavigationActions.reset({
    index: 1,
    actions: [
        NavigationActions.navigate({ routeName: 'HomeTabs' }),
        NavigationActions.navigate({ routeName: 'FeedbackForm'})
    ]
}));

[githubmss]

Can any one help me on this :-
https://stackoverflow.com/questions/44801667/navigate-to-root-screen-from-nested-stack-navigator?noredirect=1#comment76584210_44801667