React Native之如何实现Android的返回键BackAndroid

这篇文章主要介绍React Native之如何实现Android的返回键BackAndroid，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！

代码:

// BackAndroidTool // 功能: "安卓手机上的返回键" // Created by 小广 on 2016-05-10 下午. // Copyright © 2016年 All rights reserved.   'use strict'; import React,{  PlatfORM,  Navigator,  BackAndroid,  ToastAndroid,  NativeModules, } from 'react-native';  // 类 var NativeCommonTools = NativeModules.CommonTools;  export default {  // 监听返回键事件  addBackAndroidListener(navigator) {  if (Platform.OS === 'android') {   BackAndroid.addEventListener('hardwareBackPress',() => {    return this.onBackAndroid(navigator);   });  }  },   // 移除监听  removeBackAndroidListener() {  if (Platform.OS === 'android') {   BackAndroid.removeEventListener('hardwareBackPress', () => {   });  }  },   // 判断是返回上一页还是退出程序  onBackAndroid(navigator) {  if (!navigator) return false;  const routers = navigator.getCurrentRoutes();  // 当前页面不为root页面时的处理  if (routers.length > 1) {   const top = routers[routers.length - 1];   if (top.ignoreBack || top.component.ignoreBack) {    // 路由或组件上决定这个界面忽略back键    return true;   }   const handleBack = top.handleBack || top.component.handleBack;   if (handleBack) {    // 路由或组件上决定这个界面自行处理back键    return handleBack();   }  // 默认行为： 退出当前界面。   navigator.pop();   return true;   }  // 当前页面为root页面时的处理  if (this.lastBackPressed && (this.lastBackPressed + 2000 >= Date.now())) {    //最近2秒内按过back键，可以退出应用。    NativeCommonTools.onBackPressed();    return true;   }   this.lastBackPressed = Date.now();   ToastAndroid.show('再按一次退出应用',ToastAndroid.SHORT);   return true;  },   // 自定义返回按钮事件  customHandleBack(navigator, handleBack) {  if (navigator) {   let routes = navigator.getCurrentRoutes(); //nav是导航器对象   let lastRoute = routes[routes.length - 1]; // 当前页面对应的route对象   lastRoute.handleBack = handleBack;  }  },  }

其中的java原生代码如下:

管理类:RCTCommonToolsPackage (ps:如是不明白,可以去这里 React Native学习:Http://reactnative.cn/docs/0.25/native-modules-android.html#content);

package com.commonTools;  import com.facebook.react.ReactPackage; import com.facebook.react.bridge.javascriptModule; import com.facebook.react.bridge.NativeModule; import com.facebook.react.bridge.ReactApplicationContext; import com.facebook.react.uimanager.ViewManager;  import java.util.Arrays; import java.util.Collections; import java.util.List;  public class RCTCommonToolsPackage implements ReactPackage {  @Override  public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {  return Arrays.<NativeModule>asList(new RCTCommonTools(reactContext));  }   @Override  public List<Class<? extends JavaScriptModule>> createjsModules() {  return Collections.emptyList();  }   @Override  public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {  return Collections.emptyList();  } }

自定义方法的类:RCTCommonTools

package com.commonTools;  import android.content.Intent;  import com.facebook.react.bridge.Callback; import com.facebook.react.bridge.ReactApplicationContext; import com.facebook.react.bridge.ReactContextBaseJavaModule; import com.facebook.react.bridge.ReactMethod;  import com.tcpaydls.BuildConfig;  public class RCTCommonTools extends ReactContextBaseJavaModule {   public RCTCommonTools(ReactApplicationContext reactContext) {  super(reactContext);  }   @Override  public String getName() {  return "RCTCommonTools";  }     @ReactMethod  public void onBackPressed() {  Intent setIntent = new Intent(Intent.ACTION_MaiN);  setIntent.addCateGory(Intent.CATEGORY_HOME);  setIntent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);  getCurrentActivity().startActivity(setIntent);    } }

以上是“React Native之如何实现Android的返回键BackAndroid”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注编程网精选频道！