最近在公司做一个 RN 项目, 其中因为对接了一些友盟推送等功能,于是需要和原生通信数据,于是上网查了下,这类资料在网上已经有许多了,在这就做个整理,也为自己加深印象
首先 RN 与 IOS 通信,在原生端需创建一个bridge ,并遵守<RCTBridgeModule>协议
#import <React/RCTBridgeModule.h>
@interface PushModule : NSObject<RCTBridgeModule>
其次,在@implementation中导出 Module,这里,当导出 module,也就是RCT_EXPORT_MODULE()之后,RN 中引用这个 module,就会自动创建一个对象,IOS 原生这边不要额外 alloc 或者 new 一个新对象
@implementation PushModule
RCT_EXPORT_MODULE()
然后 有几种通信方式
- 定义导出的方法名
RCT_EXPORT_METHOD(pushEvent:(NSString *)event callback:(RCTResponseSenderBlock)callback){
NSLog(@"----对React Native提供调用方法,Callback---%@",event);
NSString *callbackData = @"原生数据被RN调用"; //准备回调回去的数据
callback(@[[NSNull null],callbackData]);
}
定义一个方法后,RN 就可通过NativeModules获取到对于 Module后调用相应方法,event是 RN 传给 IOS 的值,IOS 这边可通过 callback 这个 block 回调给 RN 数据
callBackEvent (){
NativeModules.PushModule.pushEvent(('RN->原生的数据'),(error, events) => {
if (error) {
console.log(error);
}else {
alert(events)
}
})
}
- promise实现的回调函数
这种,原生这边区别不是很大, 但回调 block 得使用特定的
static RCTPromiseResolveBlock _resolve;//成功回调
static RCTPromiseRejectBlock _reject;//失败回调
RCT_REMAP_METHOD(pushPromisesEvent,
resolver:(RCTPromiseResolveBlock)resolve
rejecter:(RCTPromiseRejectBlock)reject){
_resolve = resolve;
_reject = reject;
}
//异步回调函数
+(void) handleResult:(id)result{
//原生Promises数据被RN调用
if ([result isEqualToString:@"获取数据成功"]) {
_resolve(@[result]);
}else{
//返回错误信息
NSError *error=[NSError errorWithDomain:result code:101 userInfo:nil];
_reject(@"no_events", @"There were no events", error);
}
}
RN 调用方法
NativeModules.PushModule.pushPromisesEvent().then((events)=>{
alert(events+1111)
}).catch((e)=>{
// alert(e)
console.log("错误信息------"+e);
})
}
- 还有一种就是通知模式, 与前两者不同,IOS 原生 module 不仅要遵守协议,还要继承RCTEventEmitter类
#import <React/RCTEventEmitter.h>
#import <React/RCTBridgeModule.h>
@interface PushModule : RCTEventEmitter<RCTBridgeModule>
在 .m 的实现中有几个继承方法需要实现
//IOS 回传给 RN 的通知方法
- (NSArray*)supportedEvents{
return @[@"Notice_name"]
}
- (void)startObserving
{
[PushTool sharedPushTool].isReady = YES;
[[NSNotificationCenter defaultCenter] addObserver:self
selector:@selector(notice:)
name:@"event-notice"
object:nil];
}
-(void)notice:(NSNotification*)notification
{
NSDictionary*obj = notification.object;
[self sendEventWithName:@"Notice_name" body:obj];
}
在 RN 这边添加监听
var module = new NativeEventEmitter(NativeModules.PushModule)
module.addListener('Notice_name',(data)=>this.message(data));
之前 IOS 也可以和安卓那边统一,使用DeviceEventEmitter来添加监听,但先好像已经被遗弃
网友评论