RN系列：Android原生与RN如何交互通信

Posted 2023-03-27

参考技术A

React Native在Android混编项目中的页面跳转和方法调用大致可以通过上面这张简图来描述下：

RN通信原理简单地讲就是，一方native（java）将其部分方法注册成一个映射表，另一方（js）再在这个映射表中查找并调用相应的方法，而Bridge担当两者间桥接的角色。
其实方法调用大致分为2种情况：

RN调用android需要module名和方法名相同，而Android调用RN只需要方法名相同。
（1）RCTDeviceEventEmitter 事件方式
​ 优点：可任意时刻传递，Native主导控制。
（2）Callback 回调方式
​ 优点：JS调用，Native返回。
​ 缺点：CallBack为异步操作，返回时机不确定
（3）Promise
​ 优点：JS调用，Native返回。
​ 缺点：每次使用需要JS调用一次
（4）直传常量数据（原生向RN）
​ 跨域传值，只能从原生端向RN端传递。RN端可通过 NativeModules.[module名].[参数名] 的方式获取。

注意： RN层调用NativeModule层进行界面跳转时，需要设置FLAG_ACTIVITY_NEW_TASK标志。

例如下分别以 原生调用RN 和 RN调用原生 为例简单描述下：

需要添加facebook的两个图片加载库：(注意版本号尽量与你使用的RN版本内部使用的fresco版本保持一直)