RN和原生端(iOS)交互(关于百度地图)

去年我开始参与一个RN项目,其中我的工作是负责和前端协调百度地图接口,就是RN端调原生的地图并显示,其中我负责写需要的接口。我们的项目主要还是原生的,RN项目是嵌在其中的一个子模块,背景介绍完毕。

1.以下是进入的入口debug的时候地址是前端项目地址,需要前端起RN项目的npm服务器,如果是release,则是去codePush服务器下载最新代码。

RN和原生端(iOS)交互(关于百度地图)_第1张图片

2.下面这个类是管理地图的类,返回值view即使百度地图的view,当然RN那边也需要对应的代码去接收这个视图,具体我就不去扣代码了,网上可以搜到。


RN和原生端(iOS)交互(关于百度地图)_第2张图片RN和原生端(iOS)交互(关于百度地图)_第3张图片


3.下面是写接口的文件

注意.h文件需要遵守的协议

RN和原生端(iOS)交互(关于百度地图)_第4张图片


RN和原生端(iOS)交互(关于百度地图)_第5张图片


RCT_EXPORT_METHOD 

我理解的这个宏是把该方法暴露给RN。

下面介绍几种传值方式:

(1)其中计算距离这个是第一种传值方式“callback”,也就是RN调原生,然后原生会返回一个callback,里面可以携带参数。

(2)下面是第二种传值方式Promise,也是RN调原生方法,并传值,啊,然而这两个之间的区别,我已然忘记了。。。这个方法在我们项目是用在RN端调原生的本地图片并且上传的时候。

RN和原生端(iOS)交互(关于百度地图)_第6张图片

Promise

(3)第三种是event的方式,就是原生端在某些特定情况给RN发消息,当然RN端需要有对应的事件监听。使用方法如图:(其中的警告没事)

RN和原生端(iOS)交互(关于百度地图)_第7张图片


4、接下来就是其中用到的RN跳原生界面,其中需要注意的是必须在主线程执行,要不然不能实现。RN和原生端(iOS)交互(关于百度地图)_第8张图片


好了。最后强调一句所有的方法是写在接口类的文件里的,传递视图MAP的文件只负责传视图(我是这样做的,其他的可不可以我也不敢保证)。只能说写出这些方法经历了很多坑,RN端的代码我暂时不想扣,如果有同学需要的话可以留言,有时间我去加上。



你可能感兴趣的:(RN和原生端(iOS)交互(关于百度地图))