堆栈导航器后退导航无法正常工作

时间:2017-11-09 10:07:24

标签: react-native react-native-android react-navigation stack-navigator

我在堆栈导航器后退导航中遇到一个奇怪的行为。我有一个带有一些图标的应用程序主页,点击图标会打开一个新页面。里面还有哪些页面。 首页 - > Icon1-> Page1-> Page2-> Page3这样。

在主屏幕上,我添加了一个BackHandler,要求退出应用程序,而不是直接退出应用程序。每当我从其他屏幕回到主屏幕时,它都不会要求选项。它仅在渲染发生时才有效,并且在后向导航时我不认为渲染会再次发生。如果我在内页上添加BackHandler,它们根本就不起作用。所以我很困惑如何使用StackNavigator处理后向导航。

处理主屏幕上的android按钮的代码。导航到其他屏幕时删除侦听器。如果打开应用程序并按回按钮然后调用此处理程序,但是当我导航到其他屏幕并返回到主页时,则不会调用此处理程序并且应用程序直接退出而不显示提示。

    componentDidMount() {
        SplashScreen.close({animationType: SplashScreen.animationType.fade, duration: 2000, delay: 500})
        if (Platform.OS == "android") {
          BackHandler.addEventListener('hardwareBackPress', this.handleBackButton);
        }
      }

  handleBackButton = () => {
    var route = this.props.navigation.state.routeName;
    if(route == 'LoginPage')
    {
    Alert.alert('Exit App', 'Exiting the application?', [
      {
        text: 'No',
        onPress: () => console.log('Cancel Pressed'),
        style: 'cancel'
      }, {
        text: 'Yes',
        onPress: () => BackHandler.exitApp()
      }
    ], {cancelable: false})
  }
    return true;
  }

<TouchableOpacity
                activeOpacity={.5}
                onPress={() => {
                BackHandler.removeEventListener('hardwareBackPress', this.handleBackButton);
                navigate("LiveTV")
              }}>

0 个答案:

没有答案