React Native-Android-全局禁用后退按钮的问题

Question

因此，我在Android中遇到了React Native问题。 我有以下导航器：

const AppStackNavigator = createStackNavigator({
    loginFlow: createStackNavigator({
        Start: { screen: Start },
        Signup: { screen: Signup },
        Login: { screen: Login },
    },{
        headerMode: "none",
        initialRouteName: "loginFlow",
    })
});

有了这个，我有3个屏幕，开始，注册和登录，而loginFlow是initialRouteName 。 Start.js包含以下内容：

componentDidMount() {
    BackHandler.addEventListener("hardwareBackPress", this.handleBackButton);
}

handleBackButton() {
    // Logic to increment backPresses removed, opens as Alert (confirm)
    if(global.backPresses >= 2){
        BackHandler.exitApp();
    }
    return true;
}

render() {
    return (
        <Row>
            <Col>
                <Button full onPress={() => this.props.navigation.navigate("Signup")}>
                    <Text>{"Sign Up"}</Text>
                </Button>
            </Col>
            <Col>
                <Button full onPress={() => this.props.navigation.navigate("Login")}>
                    <Text>{"Log In"}</Text>
                </Button>
            </Col>
        </Row>
    );
}

本质上， Start.js充当注册和登录的中心。 最重要的是，它将hardwareBackPress事件侦听器设置为return true; ，以全局禁用Android后退按钮，除非双击后退按钮（为简便起见删除了逻辑）。

在“开始”上按返回按钮，或导航到“注册/登录”，然后按“返回”按钮，则没有任何反应，这是预期的行为。

在调用Backhandler.exitApp() ，关闭应用程序然后重新打开它之前，此功能都很Backhandler.exitApp() 。 发生这种情况时，“开始”按钮上的“后退”按钮被禁用，但是一旦导航到“注册/登录”，我就可以按“后退”按钮并返回到“开始”按钮，这不是预期的功能。

总结一下：

1. 开启应用程式
2. 按下返回（无）
3. 向前浏览
4. 按下返回（无）
5. 双击返回（退出，确认）
6. 重新开启应用程式
7. 按下返回（无）
8. 向前浏览
9. 按下返回（向后导航） 问题

我相信这是BackHandler.exitApp();的问题BackHandler.exitApp(); ，因为只需全局禁用后退按钮就可以正常工作。 但是我无法弄清楚。 重新打开应用程序时，该代码似乎可以正常工作，但在向前导航后似乎不再适用。 而且，我从不删除事件侦听器，如步骤4的结果所示，但似乎有一些阻止它。

还有其他人看到过这个问题吗？

Answer 1

在将要注册的组件中，您可以使用退出应用程序功能为后代添加事件监听器。 这将有助于它不会将您重定向到“开始”屏幕，而只是关闭您的应用程序。

Answer 2

不能在componentWillUnmount中的removeEventListener解决此问题吗？

componentDidMount() {
    BackHandler.addEventListener("hardwareBackPress", this.handleBackButton);
}

componentWillUnmount() {
    BackHandler.removeEventListener("hardwareBackPress", this.handleBackButton);
}

handleBackButton() {
    // Logic to increment backPresses removed, opens as Alert (confirm)
    if(global.backPresses >= 2){
        BackHandler.exitApp();
    }
    return true;
}

调用componentWillUnmount不会删除后退按钮的全局侦听器，因为Start.js View仅在用户关闭应用程序时才会被卸载。 通过导航器导航到其他视图时，即使该组件不可见，该组件也会保持安装状态（至少这是react-native-navigation中的行为）。