react-native与原生Objective-C的通信

Objective-C向react-native发送消息

当需要使用oc向rn发送消息时,只需要导入头文件RCTBridge.h以及RCTEventDispatcher.h,并在需要发送消息的地方添加代码

[self.bridge.eventDispatcher sendAppEventWithName:eventName body:eventBody];

但是如果使用这种方式则会出现一则警告:

'sendAppEventWithName:body:'is deprecated: Subclass RCTEventEmitter instead

因此,我们可以使用RCTEventEmitter对象进行发送消息,最简单的方式,我们可以让消息发送类继承自RCTEventEmitter,然后在需要发送消息的地方添加代码

[self sendAppEventWithName:eventName body:eventBody];

这样就不会再有警告了,但是此时如果运行项目的话程序就会崩溃,通过断点可以看到代码卡在了RCTAssert(RCTClassOverridesInstanceMethod(self, @selector(supportedEvents)), @"You must override the ‘supportedEvents’ method of %@", self);这里,所以我们需要复写supportedEvents方法:

- (NSArray<NSString *> *)supportedEvents
{
  return @[eventName];
}

这时,消息发送端的代码已经写好了。
当rn想要接收来自oc的消息时,需要添加监听者,如果使用的是RCTEventEmitter对象发送的消息的话,添加监听者的方式是:

/*
  OCClassName:消息发送类类名
  eventBody:oc传过来的消息实体,可作为参数在coding处使用
  eventName:string类型,需要和oc类中定义的一致
*/
var NativeAppEventEmitter = NativeModules.OCClassName;
var eventObject = new NativeEventEmitter(NativeAppEventEmitter);
this.listener = eventObject.addListener(
    'eventName', (eventBody) => {
      // coding
    }
);

如果使用的是RCTEventDispatcher对象发送的消息,也就是使用[self.bridge.eventDispatcher sendAppEventWithName:eventName body:eventBody];进行消息发送的话,则可以使用更简单的监听者添加方式:

this.listener = NativeAppEventEmitter.addListener(
    'eventName', (eventBody) => {
        // coding
     }
);

react-native向Objective-C发送消息

react-native向oc发送消息很简单,需要让oc接收类遵守RCTBridgeModule协议,然后调用两个宏:

/*
  此宏介意包含一个参数,用来指定js访问此模块的名字
  也可以不指定,那么久默认使用oc的类名
*/
RCT_EXPORT_MODULE(); 
/*
  此宏是为了抛出react-native可以调用的方法
  方法名以及参数类型根据项目需求自行定义
*/
RCT_EXPORT_METHOD(methodName: (NSString *)msg) {
  NSLog(@"react-native 传来了 %@",msg);
}

使用react-native向oc发送消息,则需要在rn处添加

// OCClassName为消息接收类的类名
var sendCenter = NativeModules.OCClassName;
// sendMessage要与在oc类中声明的方法一致
sendCenter.sendMessage('message');
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。