React Native与Android原生通信实战：数据交互与模块创建

"React Native与Android原生通信的方法主要探讨了如何在React Native应用中实现与Android原生代码的交互，特别是如何通过原生模块和JavaScript传递数据。这对于混合开发至关重要，提供了实用的参考方案。" 在React Native的混合开发中，原生Android代码与React Native之间的通信是非常关键的，这使得开发者能够利用React Native的高效开发优势同时充分利用Android平台的特性和功能。以下是详细步骤和关键知识点： 1. 创建原生模块：在Android端，你需要创建一个Module类，并让它继承自`ReactContextBaseJavaModule`。这个类是React Native与Android原生代码交互的桥梁。例如，你可以定义一个名为`ToastEx`的类，其中包含React Native可以调用的方法。 ```java public class ToastEx extends ReactContextBaseJavaModule { //... } ``` 2. 定义方法：在Module类中，通过`@ReactMethod`注解定义可供JavaScript调用的方法。这些方法可以接受参数，如回调函数、Promise等，用于传递数据或执行操作。例如，展示一个Toast消息： ```java @ReactMethod public void showToast(String message) { Toast.makeText(getReactApplicationContext(), message, Toast.LENGTH_SHORT).show(); } ``` 3. 创建Package类：创建一个继承自`ReactPackage`的类，用于包装你的原生模块。在这个类中，你需要实现`createNativeModules()`方法，返回包含你的Module实例的列表。 ```java public class CustomReactPackage implements ReactPackage { @Override public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) { List<NativeModule> modules = new ArrayList<>(); modules.add(new ToastEx(reactContext)); return modules; } //... } ``` 4. 注册Package：最后，在你的React Native应用的主Activity（通常继承自`ReactActivity`或`ReactActivityDelegate`）中，重写`getPackages()`方法，将你的Package类添加到返回的列表中，这样React Native就能找到并加载这些原生模块。 ```java @Override protected List<ReactPackage> getPackages() { return Arrays.asList( new MainReactPackage(), new CustomReactPackage() // 注册你的Package ); } ``` 5. JavaScript调用：在React Native的JavaScript代码中，你可以使用`NativeModules`对象来访问和调用Android原生模块的方法。例如，调用我们之前定义的`showToast`方法： ```javascript import { NativeModules } from 'react-native'; const { ToastEx } = NativeModules; // 在适当的地方调用 ToastEx.showToast('Hello from Android!'); ``` 通过以上步骤，React Native应用就可以与Android原生代码进行有效的通信，实现在JavaScript和Android原生代码之间传递数据和调用功能。这种机制使得React Native可以充分利用Android的丰富API，增强应用的功能和性能。同时，也可以通过发送事件来实现更复杂的异步通信，例如通过`DeviceEventManagerModule.RCTDeviceEventEmitter`向JavaScript发送自定义事件。