React Native 中的 BackHandler 不工作

Question

const RootNav = createStackNavigator(
  {
    Splash: {
        screen:Splash
    },
    BeforeLogin: {
        screen:BeforeLogin
    },    
    Signin: {
        screen:Signin,
    },
    Signup: {
        screen:Signup
    },
    Tabs: {
        screen:TabHolder,
    },
    ForgotPassword: {
        screen:ForgotPassword
    },
  } );

下面是我在 BeforeLogin 屏幕中使用的 BackHandler。

  componentWillMount() { 
    BackHandler.addEventListener('hardwareBackPress', this.handleBackButton); 
  } 

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

  handleBackButton = () => { 
    BackHandler.exitApp(); 
  }

下面是我在 Signin 屏幕和 Signup 屏幕中使用的 BackHandler。

  componentDidMount() {
    BackHandler.addEventListener('hardwareBackPress',() => {   

      this.props.navigation.navigate('BeforeLogin');
      return true;

    });
  }

我的 BeforeLogin 屏幕有 2 个按钮。将我导航到 Signin 和 Signup 屏幕的登录和注册。

现在，我面临两种情况。

场景 1： 我在 BeforeLogin 屏幕上，但我没有导航到 Signin 或 Signup 屏幕。现在，当我按下 android 后退按钮时，它会关闭应用程序。这就是我想要的，当用户从 BeforeLogin 屏幕按下后退按钮时能够关闭应用程序。

场景 2： 我在 BeforeLogin 屏幕上，我导航到 Signin 或 Signup 屏幕。现在当我返回 BeforeLogin 屏幕然后按 android 后退按钮时，应用程序现在没有关闭。

如何解决我的 场景 2:？请帮忙。

Answer 1

不要在不必要的情况下使用 backhander，因为它不会运行在 ios 设备上。

使用 this.props.navigation.replace("")

导航

即如果您从 A 导航到 B 并且不想在按下后退按钮时返回到 A，请不要使用 this.props.navigation.navigate("B") 而是使用 this.props.navigation.replace("B")

或

尝试 react-navigation@3.0 的新功能 SwitchNavigator。

默认情况下，当按下后退按钮时，应用程序将关闭切换导航器中使用的所有路线屏幕。因此，在 SwitchNavigator 中定义您要为其退出应用程序的所有屏幕，以及 StackNavigator 中的所有其他内容或您使用的任何内容。

React Native 中的 BackHandler 不工作

BackHandler in React Native isn't working

android

reactjs

react-native

react-navigation

react-navigation-stack