React-Native 调用 iOS Native 方法

React Native在设计之初,就考虑到了React Native提供的API,不能够完全的覆盖平台对应的所有API.因此在React Native中可以方便的调用Native的方法,Android上面对应Java方法,IOS上对应Object-C方法。

有的时候在处理数据库,多线程上面,使用Native加的方便。

下面就以调用IOS系统的Alert为例,看下怎么使用JavaScript代码调用Object-C的Native方法的。

RCTBridgeModule

RCT是ReaCT的缩写,React Native中Object-C相关的命名均以RCT开头。

RCTBridgeModule是定义好的protocol,实现该协议的类,会自动注册到Object-C对应的Bridge中。

Object-C Bridge上层负责与Object-C通信,下层负责和JavaScript Bridge通信,而JavaScript Bridge负责和JavaScript通信.

这样,通过Object-C Bridge和JavaScript Bridge就可以实现JavaScript和Object-C的相互调用。

先要定义一个类:RNIOSAlert用来现实RCTBridgeModule协议。

RCT_EXPORT_MODULE

所有实现RCTBridgeModule的类都必须显示的include宏命令:RCT_EXPORT_MODULE()

RCT_EXPORT_MODULE的作用是:自动注册一个Module,当Object-c Bridge加载的时候。这个Module可以在JavaScript Bridge中调用。

RCT_EXPORT_MODULE宏命令的定义:

可以看到RCT_EXPORT_MODULE接受字符串作为其Module的名称,如果不设置名称的话默认就使用类名作为Modul的名称。

引入RCT_EXPORT_MODULE:

RCT_EXPORT_METHOD

RCT_EXPORT_METHOD是用来定义被JavaScript调用的方法的宏。RCT_EXTERN_METHOD调用了宏RCT_EXTERN_REMAP_METHOD,最终调用宏RCT_EXTERN_REMAP_METHOD

RCT_EXTERN_REMAP_METHOD的代码实现:

它的作用是在RCT_EXPORT_MODULE定义的Module下面,定义一个可以被JavaScript调用的方法。

RCT_EXPORT_MODULE的使用,需要写入方法名,参数以及完整的实现,例如:

JavaScript调用

在JavaScript中调用Object-C定义的方法,需要先导入NativeModules,再使用RNIOSAlert

完整代码如下:

成功调用Alert

参数

RCT_EXPORT_METHOD支持需要JSON所支持的数据类型,JavaScript中的参数与Object-C的参数的对应关系。

  • string -> NSString
  • number -> (NSInteger,float,double,CGFloat,NSNumber)
  • boolean -> (BOOL,NSNumber)
  • array -> NSArray
  • object -> NSDictionary
  • function -> RCTResponseSenderBlock

另外React Navite还提供了RCTConvert,详情的代码可以参照 https://github.com/facebook/react-native/blob/master/React/Base/RCTConvert.h,他的作用可以把传入的参数转换为需要的数据类型。

比如我们在Object-C中定义一个方法,该方法接收NSDictionary参数:

这里使用RCTConvert直接把NSDictionary中的值转换为NSDate.

在JavaScript中的调用showTime方法:

源代码地址:https://github.com/jjz/react-native/tree/master/RNIos

1 收藏 评论

关于作者:姜家志

IOS,Android开发者。 个人主页 · 我的文章 · 5 ·   

相关文章

可能感兴趣的话题



直接登录
跳到底部
返回顶部