iOS 原生模塊 給 Javascript(ReactNative) 發送事件 (通知監聽)

就給我們這幾句話 就打發我們了。

#import <React/RCTBridgeModule.h>
#import <React/RCTEventEmitter.h>

@interface EventEmitterManager : RCTEventEmitter <RCTBridgeModule>

@end

EventEmitterManager.m

#import "EventEmitterManager.h"
#import <React/RCTEventDispatcher.h>
#import <React/RCTLog.h>

NSString *const kEventEmitterManagerEvent  = @"EventEmitterManagerEvent";

@implementation EventEmitterManager

//@synthesize bridge = _bridge;

RCT_EXPORT_MODULE();

// 等 RN組件 監聽事件通知後 在發送事件通知
RCT_EXPORT_METHOD(postNotificationEvent:(NSString *)name)
{
  RCTLogInfo(@"postNotificationEvent->:%@",name);
  [self sendEventWithName:kEventEmitterManagerEvent body:name];
}

- (NSDictionary<NSString *, NSString *> *)constantsToExport {
  return @{ @"EventEmitterManagerEvent": kEventEmitterManagerEvent,
            };
}

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

@end

RN組件：

componentWillMount(){

        // 拿到原生模塊
        var EventEmitterManager = NativeModules.EventEmitterManager;

        // 創建自定義事件介面
        const eventEmitterManagerEmitter = new NativeEventEmitter(EventEmitterManager);

        // 導出常量
        const EventEmitterManagerEvent   = EventEmitterManager.EventEmitterManagerEvent;

        // 監聽原生 發送的通知
        this.listener = eventEmitterManagerEmitter.addListener(
            EventEmitterManagerEvent,
            (data) => Alert.alert('來了 來了 ->'+ data)
        );
    }

    componentDidMount() {
        var EventEmitterManager = NativeModules.EventEmitterManager;
        // 調用原生模塊 postNotificationEvent方法
        EventEmitterManager.postNotificationEvent('張楊事件傳遞');
    }

    componentWillUnmount(){
        this.listener.remove();
    }