《ReactNatve》之处理Android返回键

BackAndroid已经被废弃,使用BackHandler。

这块代码写在Navigator组件initialRoute的那个class,也就是Navigator导航进入的第一个视图。

import React, { Component } from 'react';
import {
  StyleSheet,
  Text,
  View,
  BackHandler,
  Platform,
  ToastAndroid,
} from 'react-native';
var lastBackTime = "";//记录点击返回键的时间
export default class HomeComponent extends Component {
  componentWillMount(){
    BackHandler.addEventListener('hardwareBackPress', () => {
      if (this.props.navigator) {
          let routes = this.props.navigator.getCurrentRoutes();
          let lastRoute = routes[routes.length - 1]; // 当前页面对应的route对象
          if (lastRoute.onHardwareBackPress) {// 先执行route注册的事件
              let flag = lastRoute.onHardwareBackPress();
              if (flag === false) {// 返回值为false就终止后续操作
                  return true;
              }
          }  
          if (routes.length === 1) {// 在第一页了,2秒之内点击两次返回键,退出应用
            if(this.lastBackPressed && (lastBackTime+2000) >= Date.now()){
                return false;
            }
            // 此处可以根据情况实现 点2次就退出应用,或者弹出rn视图等
            //记录点击返回键的时间
            lastBackTime = Date.now();
            ToastAndroid.show('再按返回退出应用', ToastAndroid.SHORT);


          } else {
              this.props.navigator.pop();
          }
      }
      return true;
    });
  }
  componentWillUnmount() {
    if (Platform.OS === 'android') {
      BackHandler.removeEventListener('hardwareBackPress',()=>{});
    }
  }
}



    

你可能感兴趣的:(ReactNative)