BackHandler 'hardwareBackPress 只工作一次 |反应原生

Question

我需要处理 Android 设备上的 Back Press，但我的 BackHandler 只工作一次。

这是我的代码片段 -

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

        handleBackPress = () => {

            console.log("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;
            }

        }

我需要在菜单视图上处理这个问题，因为我需要在其他组件的后按时显示默认组件。

Answer 1

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

    handleBackPress = () => {

        console.log("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;
        }

    }

Answer 2

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

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

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