Оборудование BackHandlerBackPress работает только Единоразово | React native

Мне нужно обработать Back Press на устройстве Android, но мой BackHandler работает только один раз.

Вот мой фрагмент кода -

 componentWillUnmount() {
        BackHandler.removeEventListener('hardwareBackPress', this.handleBackPress);
    }
    componentDidMount() {
        BackHandler.addEventListener('hardwareBackPress', this.handleBackPress);
    }

        handleBackPress = () => {

            console.info("handleBackPress Called on RootMenuView : current View ? : " + this.state.mainView);

            if (this.state.mainView === "Main"){
                return false;
            } else{
                this.state.mainView = "Main";
                this.forceUpdate();
                return true;
            }

        }

Мне нужно обработать это в представлении меню, так как мне нужно показать компонент по умолчанию при обратном нажатии других компонентов.

1
0
1 264
2

Ответы 2

 componentWillUnmount() {
    BackHandler.removeEventListener('hardwareBackPress', this.handleBackPress);
   }
   componentDidMount() {
    BackHandler.addEventListener('hardwareBackPress', this.handleBackPress);
 }

    handleBackPress = () => {

        console.info("handleBackPress Called on RootMenuView : current View ? : " + this.state.mainView);

        if (this.state.mainView === "Main"){
            return false;
        } else{
             //not this
            //this.state.mainView = "Main";
            // use this
           this.setState({mainView: "Main"})
            this.forceUpdate();
            return true;
        }

    }

Спасибо за быстрый ответ, но во второй раз слушатель не работает, я имею в виду, что этот метод handleBackPress не вызывается :(

TechValens 01.11.2018 10:21

что происходит при нажатии на кнопку "Назад"? Вы оставляете компонент? Потому что, если вы оставите компонент, componentWillUnmount запустится и удалит зарегистрированный прослушиватель.

Muhammad Shaheem 01.11.2018 10:51
 useEffect(() => {
    const backAction = () => {
      if (props.navigation.isFocused()){
      Alert.alert("Hold on!", "Are you sure you want to go back?", [
        {
          text: "Cancel",
          onPress: () =>console.info("hi"),
          style: "cancel"
        },
        { text: "YES", onPress: () => BackHandler.exitApp() }
      ]);
      return false;
    };}

    const backHandler = BackHandler.addEventListener(
      "hardwareBackPress",
      backAction
    );

    return () => backHandler.remove();
  }, []);

Другие вопросы по теме