I'm building a App with react-native v0.44.0
using redux v5.0.5
and react-navigation v1.0.0-beta.11
. The routing is done with nested navigators, one main StackNavigator and DrawerNavigator.
I'm handling all navigation events in a navigation reducer, also the hardware back press on Android using BackHandler. Now comes the weird part (for me), I've implemented the BackHandler event handlers like so:
import { BackHandler, Modal, View } from 'react-native';
import { NavigationActions } from 'react-navigation';
import { HARDWARE_BACK_PRESS } from '../helpers/NavTypes';
constructor(props) {
super(props);
this.handleBack = this.handleBack.bind(this);
}
componentWillMount() {
BackHandler.addEventListener(HARDWARE_BACK_PRESS, this.handleBack);
}
componentWillUnmount() {
BackHandler.removeEventListener(HARDWARE_BACK_PRESS, this.handleBack);
}
handleBack() {
const navAction = NavigationActions.back();
this.props.navigation.dispatch(navAction);
return true;
}
In my navigation reducer I'm handling the Navigation/BACK
action type and keep track of my state. Now, when I'm pressing the hardware back button on my Android device or in the emulator, I can see thanks to redux-logger
and the React Native debugger that the navigation action is dispatched correctly and the previous shown screen appears, but the app closes anyway. This happens also when I alter the handleBack
method to something like this:
handleBack() {
return true;
}
Every time the hardware back button is pressed, the App still closes. I did some step-debugging innode_modules/react-native/Libraries/Utilities/BackHandler.android.js
, inside of RCTDeviceEventEmitter.addListener
I can see that my event listeners are registered and invokeDefault
is set to true
in the loop. addListener
is exited but the App still closes. Does anyone know if there is some point there react-navigation and redux are overriding the behaviour of the hardware back button at some top level I'm not aware of?
I've setup a second plain RN project without react-navigation and redux, implementing the same BackHandler event listeners (also returning true) and the app won't close. So, right now this leaves me a bit puzzled.
react-native
,redux
andreact-navigation
version and everything works as aspected now. But I've created a fork of that project with the old modules where the issue still exists, as far as I've some spare time, I try to figure out what's wrong with that implementation. – nils