ReactNative: 自定义ReactNative API组件

在前面介绍了很多ReactNative中UI组件和API组件,这些都是Facebook团队封装好的基础组件,开发者可以直接使用。然而,在实际的开发过程中,面对复杂的需求,此时原生的Native组件可能就无法满足要求了。当然,这种情况Facebook团队是当然考虑过了,所以在ReactNative开发中也支持开发者进行自定义API组件。

 

二、详解

1、类模块和方法

一个普通的OC类以及方法,并不会被系统处理成模块进而被调用。模块必须在编译以及运行时向系统注册,同时告诉系统什么属性和方法可以被JavaScript调用。自定义的OC模块类必须遵守RCTBridgeModule协议。RCTBridgeModule协议定义了一些模块的基本属性和方法以及一些宏命令。可以直接通过宏命令来告诉ReactNative需要注册的模块类和暴露的方法。注意JavaScript无法识别方法重载,所以定义方法时不要重名。 常用宏命令如下:

//1、注册模块类。可选的js_name参数将用作JS模块名称。如果省略,则JS模块名称将与Objective-C类名称匹配。
//注意:如果定义的类名包含RCT前缀,会被系统格式化去除。例如原生的RCTActionSheetManager被格式化成ActionSheetManager
//也即:var RCTActionSheetManager = require('NativeModules').ActionSheetManager #define RCT_EXPORT_MODULE(js_name) //2、将OC中定义的模块方法暴露出来,method是OC方法 #define RCT_EXPORT_METHOD(method) //3、将OC中定义的模块方法暴露出来,method是OC方法,js_name是method的自定义名称 #define RCT_REMAP_METHOD(js_name, method) //4、这种方式通过“ NativeModules.MyModule.method”将MyModule和方法method同时公开给JavaScript。
//obj_name:模块类 objc_supername:模块类的父类 js_name: 模块类的别名 #define RCT_EXTERN_MODULE(objc_name, objc_supername) #define RCT_EXTERN_REMAP_MODULE(js_name, objc_name, objc_supername)

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zypzdx.html