在反应中更改抽屉导航器后,后退按钮处理程序可在每个屏幕上工作-本机

时间:2019-06-12 05:21:31

标签: react-native react-native-navigation

我正在制作一个本机应用程序,其中可以有两种类型的用户模型和成员。现在每种都有不同的drawer navigator,因为它们都有不同的数据,而且这两个抽屉都位于主stack navigator中这是应用程序的主要导航器。现在在两个drawer navigator中。


const RootStack = createStackNavigator({
  Splash : { screen: Splash },
  PrivacyPolicy : { screen: PrivacyPolicy},
  Welcome : { screen: Welcome },
  Login : { screen: Login },
  HomeMember: {screen: memberdrawerNavigator},
  HomeModel: {screen: modeldrawerNavigator},
  OtpChangePassword : { screen: OtpChangePassword},


}, {
     headerMode: 'none',
     initialRouteName: 'Splash'

})

对于成员类型,我都有一个不同的主页,在两个主页中,我都实现了这样的后处理程序。


 handleBackWithAlert = () => {

  if (this.props.isFocused) {

            if(this.state.loading_status){
                   this.setState({loading_status:false})
            }

          else{
                  Alert.alert(
                  'Exit App',
                  'Exiting the application?',
                  [
                  {
                    text: 'Cancel',
                    onPress: () => console.log('Cancel Pressed'),
                    style: 'cancel'
                  },
                  {
                    text: 'OK',
                    onPress: () => BackHandler.exitApp()
                  }
                  ],
                  {
                  cancelable: false
                  }
                );
          }

return true;
}
}



componentWillMount() {

BackHandler.addEventListener('hardwareBackPress',this.handleBackWithAlert);
//this.props.navigation.dispatch(DrawerActions.closeDrawer());
this.props.navigation.closeDrawer();

}

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

}

因为我只想检查特定页面上的处理,所以我这样导出了组件。

export default withNavigationFocus(HomePage);

现在的问题是,假设我正在使用会员帐户,然后注销,然后使用模型帐户登录,那么此后处理程序在每个屏幕上都起作用,为什么?而且,如果我关闭或杀死该应用程序而没有注销并重新启动,则此问题将消失。

这是我注销时调用的代码

 AsyncStorage.clear()
ToastAndroid.show("Logged Out Successfully !",ToastAndroid.SHORT);

              const resetAction = StackActions.reset({
                index: 0,
                actions: [NavigationActions.navigate({ routeName: 'Welcome' })],
              });
              this.props.navigation.dispatch(resetAction);

请帮助我解决此问题。预先感谢。

1 个答案:

答案 0 :(得分:0)

根据我的理解,您的BackHandler听众有问题。也许您没有删除BackHandler上的componentWillUnmount侦听器?