后退按钮反应原生的不关闭应用程序

Question

嗨，我正在尝试这样做，我有一个基本的webview应用程序，当我按下后退按钮时，我应该回到最后一个页面，但如果我在登录页面，并按下后退按钮或手势在我的Android上，我的应用程序应该退出，但不能工作。

1- 我有一个基本的webview应用程序，当我按下后退按钮，我应该回到最后一页，但如果我在登录页面上按下后退按钮或后退手势，我的应用程序应该退出，但不工作，它保持开放，当我按下后退按钮，它刷新webview一次又一次，这里是我的代码。

const styles = StyleSheet.create({
  flexContainer: {
    flex: 1
  }
})
export default class App extends Component {
  webView = {
    canGoBack: false,
    ref: null,

  }
  onAndroidBackPress = () => {
    if (this.webView.canGoBack && this.webView.ref) {
      this.webView.ref.goBack();
      return true;
    }
    return false;
  }

  componentWillMount() {
    if (Platform.OS === 'android') {
      BackHandler.addEventListener('hardwareBackPress', this.onAndroidBackPress);
    }
    setTimeout(() => {
      SplashScreen.hide();
  }, 1800);

  }

  componentWillUnmount() {
    if (Platform.OS === 'android') {
      BackHandler.removeEventListener('hardwareBackPress');
    }
  }
  render() {
    return (

      <SafeAreaView style={styles.flexContainer}>
       <WebView
        source={{uri: 'https://clientes.dbsnetwork.net'}}
        startInLoadingState={true}
        allowsBackForwardNavigationGestures
        renderLoading={() => (
          <ActivityIndicator
            color='black'
            size='large'
            style={styles.flexContainer}
          />
        )}
        style={{marginTop: 0}}
        ref={(webView) => { this.webView.ref = webView; }}
        onNavigationStateChange={(navState) => { this.webView.canGoBack = navState.canGoBack; }}
      />
      </SafeAreaView>
    );
  }

}

还有什么我应该做的吗？

附上视频gif

谢谢你。

Answer 1

该功能看起来不是去退出应用程序。

应该是这样的：(编辑你的部分代码)

import { BackHandler } from "react-native";

...
onAndroidBackPress = () => {
    if (this.webView.canGoBack && this.webView.ref) {
        BackHandler.exitApp(); //Function to exit the App
        return true;
    }
    return false;
}
...