React-native-router-flux: Android: Hardware back press on same scene closes the app

Created on 25 Sep 2017  路  5Comments  路  Source: aksonov/react-native-router-flux

Version

  • react-native-router-flux v4.0.0-beta.21
  • react-native v0.48.3

Description

I have a scene with a list of tasks, some of which have subtasks.
Pressing on an icon to show subtasks opens the same scene, but with different data.

Expected behaviour

When in subtask list, pressing hardware back button should take me to parent task list (which is the previous scene in the stack).

This is how it worked in rnrf v3.

Actual behaviour

The app closes, because of
return _navigationStore2.default.currentScene!==_navigationStore2.default.prevScene;
in onBackPress callback. Even though prevScene === currentScene, their keys are different and they have different props.

Steps to reproduce

Scene I'm rendering:

const sceneRoot = ({ level }) => (
    <View>
        <Text>Scene {level}</Text>

        <Button title="Deeper" onPress={() => {
            Actions.root({
                level: level + 1,
            });
        }} />
    </View>
);

How I render the router:

export default class RouterComponent extends React.Component {
    render() {
        return (
            <Router>
                <Scene>
                    <Scene key="root" component={sceneRoot} />
                </Scene>
            </Router>
        );
    }
}

Try pressing "Deeper" button, and then pressing hardware back button. It closes the app.
Pressing "Deeper" and then pressing back in navbar works.

Most helpful comment

I fixed it by doing this:

BackHandler.addEventListener('hardwareBackPress', this.handleHardwareBack);
...
handleHardwareBack = () => {
    Actions.pop();
    return true;
  }

All 5 comments

I'm not sure if this helps but if you call type={ActionConst.RESET} to the Scene, It will prevent the default behavior of the hardware back button.
<Router> <Scene> <Scene key="root" component={sceneRoot} type={ActionConst.RESET} /> </Scene> </Router>
Try this and let me know

I just tried this, it doesn't help. Although, I think this should be the expected behavior in that case as RESET resets the stack, which I don't want to do, I want to go back.

Thanks anyway.

+1

I fixed it by doing this:

BackHandler.addEventListener('hardwareBackPress', this.handleHardwareBack);
...
handleHardwareBack = () => {
    Actions.pop();
    return true;
  }

I can't reproduce it with the latest version of RNRF, If you still see the issue, feel free to reopen and fork and modify Example project to demonstrate.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

booboothefool picture booboothefool  路  3Comments

rafaelcorreiapoli picture rafaelcorreiapoli  路  3Comments

sreejithr picture sreejithr  路  3Comments

sylvainbaronnet picture sylvainbaronnet  路  3Comments

VictorK1902 picture VictorK1902  路  3Comments