How to configure react-native-router-flux android back history?

Question

I have this react native app using react-native-router-flux for navigation config and stages, the thing is that I can't fully understand how to setup the android history so the back button is functional.

This is my view hierarchy:

<Router>
 <Stack hideNavBar key="root"> 
    <Scene back key="mainMenu" component={MainMenu}/>
    <Scene key="about" component={About}/>
    //... and so on
</Router>

But If I press back button after presenting a view with an action, for example:

Actions.about();

and inside about view I press back android button, I get the following error message:

"undefined is not an object (evaluating that.props.navigation.navigate)"

I really don't know what Im doing wrong. Please anybody can help me?

Answer 1

If you want to move the screen back, you can solve it with a simple command.

 componentDidMount() {
    this.backHandler = BackHandler.addEventListener('hardwareBackPress', this.handleBackPress);
  }

  componentWillUnmount() {
    this.backHandler.remove()
  }

  handleBackPress = () => {
    // go back (i.e. pop the current screen off the nav stack)
    Actions.pop()
    return true;
  }