ReacNative iOS源码解析（二）（未完成）
上一篇了解了 ReactNative是如何初始化一整套JS/OC通信机制，是如何相互通信的。通篇在讲JS/OC的通信的源代码流程，解释了为什么JS可以调用OC，为什么OC可以调用JS，这相互之间的通信，是如何通过代码进行控制与管理的
但是上一篇讲的内容有一点太抽象了，全都是底层通信，我们依然不知道：
上层的业务module是如何一步步用js搭建出一款app的
于是就进入了今天的环节，ReactNative中的Native，具体讲讲各种各样的Module是如何工作的，官方写好的Module以及我们可以自行扩展的Module
这里面分为2种module
- 源生API模块 - RCTModuleData
- 源生UI组件模块 - RCTComponentData
本文在源码分析部分，对照前文的代码流程可以加深理解
源生API型模块
什么叫APIModule？
APIModule是一种面向过程式的模块调用
JS只需要用一个模块名，一个API名，就能通过bridge找到对应的native的方法进行调用，JS Call OC Method
这个过程就是一个函数调用而已，不存在操作某个实例对象，只是传递参数，操作参数，处理逻辑，返回数值 OC Call JS（通过前文知道，bridge都是异步的，通过callback block返回）
如何使用APIModule呢？
APIModule的源码是如何运作的呢？
前文说过：
需要说明的是，RCTModuleData与Module不是一个东西，各类Module继承自NSObject，RCTModuleData内部持有的instance实例才是各类Module，因此这个环节是初始化RCTModuleData真正各类Module实例的环节
APIModule最后会被RCTModuleData给包装一下，统一被RCTBatchBridge维护的一个kev-value字典表来进行管理。
源生UI组件模块
什么叫UIModule？
UIModule是一种面向对象式的UI组件调用
每一个React的Component都是一个独立的UI组件，经过React的flexbox排版计算，有自己的大小，形状，样式。
每一个被RN渲染出来的RCTView都是继承自UIView的纯源生UI组件，他是根据React的Component的计算结果（大小，形状，样式）从而创建出来的。
RCTView与Component是一一对应的
当一个JS Component对象想要创建/改变自己的颜色，大小，样式的时候，就需要通过brdige找到自己所对应的那个RCTView，传递过去相应的数据参数，对RCTView生效传来的数据 JS CALL OC
当RCTView发生了触摸等源生事件响应的时候，通过brdige找到自己所对应的JS Component，把触摸的事件和数据参数传过去，让React.JS根据数据进行JS Component的重新布局或者界面响应
正文到此结束
热门推荐
相关文章
近期评论
-
你这基本没有更新呀，最近文章显示还是2019年的文章。不符合要求哈
-
关键词：慕云博客 链接：https://www.lilun.me 描述：分享原创文字的个人博客
-
-
-
可以提供一下源码吗
-
不是商业站，鸡娃学习笔记
-
-
-
-
听他们说很厉害的样子
Loading...
![[HBLOG]公众号](http://www.liuhaihua.cn/img/qrcode_gzh.jpg)
