Question

LoginScreen.js

this.props.navigator.push({
      screen: "auxxa.LandingScreen",
      passProps: { login: true },
      overrideBackPress: true,
      navigatorStyle: {
        navBarHidden: true
      }
    });

LandingScreen.js

 constructor(props) {
    super(props);
    this.handleBackButtonClick = this.handleBackButtonClick.bind(this);
    //  this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this));
    this.state = {
      size: { width, height },
      tileData: null,
      isLoading: true,
      user_id: null,
      refetching: false,
      access_token: null
    };
  }
  componentWillMount() {
    BackHandler.addEventListener(
      "hardwareBackPress",
      this.handleBackButtonClick
    );
  }
  handleBackButtonClick() {
    console.log("check login " + this.props.login);
    if (this.backPressed && this.backPressed > 0) {
      if (this.props.login) {
        console.log("login");
        RNExitApp.exitApp();
      } else {
        console.log("root");
        this.props.navigator.popToRoot({ animated: false });
        return false;
      }
    }

    this.backPressed = 1;
    this.props.navigator.showSnackbar({
      text: "Press one more time to exit",
      duration: "long"
    });
    return true;
  }

  componentDidMount() {
    BackHandler.removeEventListener(
      "hardwareBackPress",
      this.handleBackButtonClick
    );
}

我使用Wix的 react-native-navigation 进行我的应用导航。在这里，我已附加登录屏幕和登录屏幕。成功登录的应用导航到登录屏幕后，单击了后退按钮。它将返回登录屏幕。我需要避免这种情况。该怎么办？我试图退出该应用程序。但是它也无法正常工作。如果有人知道这一点，请帮助我。谢谢您。

Answer 1

在handleBackButtonClick函数中使用此调用，为什么要在componentDidMount中删除侦听器？

this.props.navigator.resetTo({  screen: 'example.ScreenThree'})

。

Answer 2

在构造函数上取消注释this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this));以侦听导航事件并添加navigationEvent侦听器方法

onNavigatorEvent(event: NavigatorEvent) {
  if (event.type === 'NavBarButtonPress') {
    if (event.id === 'skill_information') {
      // Add here whatever you would like to do (this.handleBackButtonClick() for example)
    }
  }

React Native Android Hardware Back按钮无法正常工作

2 个答案: