服务器之家

服务器之家 > 正文

Reactnative-iOS回调Javascript的方法

时间:2021-05-10 13:49     来源/作者:FlyElephant

Reactnative可以调用原生模块,原生模块也可以给JavaScript发送事件通知.最好的方法是继承RCTEventEmitter.自定义继承自PushEventEmitter的子类RCTEventEmitter.

?
1
2
3
4
5
6
7
8
9
#import <Foundation/Foundation.h>
#import <React/RCTBridgeModule.h>
#import <React/RCTEventEmitter.h>
 
@interface PushEventEmitter : RCTEventEmitter <RCTBridgeModule>
 
- (void)addEventReminderReceived:(NSNotification *)notification;
 
@end

实现supportedEvents方法

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
#import "PushEventEmitter.h"
 
@implementation PushEventEmitter
 
+ (id)allocWithZone:(NSZone *)zone {
  static PushEventEmitter *sharedInstance = nil;
  static dispatch_once_t onceToken;
  dispatch_once(&onceToken, ^{
    sharedInstance = [super allocWithZone:zone];
  });
  return sharedInstance;
}
 
RCT_EXPORT_MODULE();
 
- (NSArray<NSString *> *)supportedEvents
{
  return @[@"EventReminder"];
}
 
- (void)addEventReminderReceived:(NSNotification *)notification {
  [self sendEventWithName:@"EventReminder" body:@{@"name": @"FlyElephant"}];
}
 
@end

React native 设置:

?
1
2
3
4
5
6
7
8
import {
  NativeModules,
  NativeEventEmitter,
} from 'react-native';
 
const PushEventEmitter = NativeModules.PushEventEmitter;
 
const emitterManager = new NativeEventEmitter(PushEventEmitter);

订阅通知和移除通知:

?
1
2
3
4
5
6
7
8
9
10
componentDidMount() {
  subscription = emitterManager.addListener(
    'EventReminder',
    (reminder) => console.log('JavaScript接收到通知:'+reminder.name)
  );
 
}
componentWillUnmount(){
  subscription.remove();// 移除通知
}

调用测试:

?
1
PushEventEmitter *eventEmitter = [PushEventEmitter allocWithZone:nil];

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。

原文链接:https://www.jianshu.com/p/027885fe88f5

相关文章

热门资讯

2020微信伤感网名听哭了 让对方看到心疼的伤感网名大全
2020微信伤感网名听哭了 让对方看到心疼的伤感网名大全 2019-12-26
yue是什么意思 网络流行语yue了是什么梗
yue是什么意思 网络流行语yue了是什么梗 2020-10-11
背刺什么意思 网络词语背刺是什么梗
背刺什么意思 网络词语背刺是什么梗 2020-05-22
苹果12mini价格表官网报价 iPhone12mini全版本价格汇总
苹果12mini价格表官网报价 iPhone12mini全版本价格汇总 2020-11-13
2021德云社封箱演出完整版 2021年德云社封箱演出在线看
2021德云社封箱演出完整版 2021年德云社封箱演出在线看 2021-03-15
返回顶部