React Native与Android原生通信

前端之家收集整理的这篇文章主要介绍了React Native与Android原生通信前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

在前两篇的内容中,和大家分享了Android原生集成RN,以及RN的增量热更新。关于详细的内容,点击如下具体了解:

Android App巧妙集成React Native最详教程

React Native 实现热部署、增量热更新

本篇内容同样和React Native 与 原生App有关,可以说更加深入了两者之间的感情,为培养下一代做出准备:React Native与原生App的通信交互。

Android系统为我们提供了webview来加载网页,同样为了让webview加载的网页可以与App交互,同样提供了一套机制帮助我们更方便的实现通信。为了实现React Native与原生App之间的通信,FB也实现了自己的一套交互机制。

(1)RCTDeviceEventEmitter 事件方式

(2)Callback 回调方式

(3)Promise

三种方式各具不同优缺点

1.RCTDeviceEventEmitter:

优点:可任意时刻传递,Native主导控制。

2.Callback:

优点:JS调用,Native返回。

缺点:CallBack为异步操作,返回时机不确定

3.Promise:

优点:JS调用,Native返回。

缺点:每次使用需要JS调用一次

了解了三者的通信方式,怎么能少了代码的描述!我们来看看代码如何实现。大致的实现步骤如下:

(1)定义Module类,继承ReactContextBaseJavaModule

在Module类中,我们定义交互的方法,例如RN调用Native的方法,Native调用RN的方法等。

(2)定义Package类,继承ReactPackage

实现Package的createNativeModules方法,将Module实例添加到集合。

(3)定义Application,继承ReactApplication

实现getPackages方法将Package实例添加getPackages下的集合。

首先来看Module类:






(1)RCTDeviceEventEmitter

原文链接:https://www.f2er.com/react/304820.html

猜你在找的React相关文章