使用步骤
以GeoMapModule为例
1、创建GeoMapModule类
2、GeoMapModule.h中引入 #import <React/RCTBridgeModule.h>,遵守RCTBridgeModule协议
#import <Foundation/Foundation.h>
#import <React/RCTBridgeModule.h>
NS_ASSUME_NONNULL_BEGIN
@interface GeoMapModule : NSObject<RCTBridgeModule>
@end
NS_ASSUME_NONNULL_END
3、导出名字,这个名字要和js端一直
RCT_EXPORT_MODULE(GeoModule);
4、写方法
RCT_EXPORT_METHOD(getGeoAppList:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject)
{
NSMutableArray *maps = [NSMutableArray array];
//需要在主线程中操作
dispatch_async(dispatch_get_main_queue(), ^{
//苹果地图
if ([[UIApplication sharedApplication]canOpenURL:[NSURL URLWithString:@"http://maps.apple.com/"]]) {
NSMutableDictionary *iosMapDic = [NSMutableDictionary dictionary];
iosMapDic[@"title"] = @"苹果地图";
iosMapDic[@"tag"] = @"apple";
[maps addObject:iosMapDic];
}
//百度地图
if ([[UIApplication sharedApplication] canOpenURL:[NSURL URLWithString:@"baidumap://"]]) {
NSMutableDictionary *baiduMapDic = [NSMutableDictionary dictionary];
baiduMapDic[@"title"] = @"百度地图";
baiduMapDic[@"tag"] = @"baidu";
// NSString *urlString = [[NSString stringWithFormat:@"baidumap://map/direction?origin={{我的位置}}&destination=name=%@&mode=driving&coord_type=gcj02",address] stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
// baiduMapDic[@"url"] = urlString;
[maps addObject:baiduMapDic];
}
//高德地图
if ([[UIApplication sharedApplication] canOpenURL:[NSURL URLWithString:@"iosamap://"]]) {
NSMutableDictionary *gaodeMapDic = [NSMutableDictionary dictionary];
gaodeMapDic[@"title"] = @"高德地图";
gaodeMapDic[@"tag"] = @"amap";
// NSString *urlString = [[NSString stringWithFormat:@"iosamap://navi?sourceApplication=%@&backScheme=%@&lat=%f&lon=%f&dev=0&style=2",@"导航功能",@"nav123456",[lat doubleValue],[lon doubleValue]] stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
// gaodeMapDic[@"url"] = urlString;
[maps addObject:gaodeMapDic];
}
//腾讯地图
if ([[UIApplication sharedApplication] canOpenURL:[NSURL URLWithString:@"qqmap://"]]) {
NSMutableDictionary *qqMapDic = [NSMutableDictionary dictionary];
qqMapDic[@"title"] = @"腾讯地图";
qqMapDic[@"tag"] = @"qqmap";
// NSString *urlString = [[NSString stringWithFormat:@"qqmap://map/routeplan?from=我的位置&type=drive&tocoord=%f,%f&to=%@&coord_type=1&policy=0",[lat doubleValue],[lon doubleValue],address] stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
// qqMapDic[@"url"] = urlString;
[maps addObject:qqMapDic];
}
resolve(maps);
});
// RCTLogInfo(@"地图app===经度:",maps);
}
5、如果有UI操作需要加上
+ (BOOL)requiresMainQueueSetup{
return YES;
}
6、js 端,创建js文件封装一下
import {NativeModules} from 'react-native';
const { GeoModule} = NativeModules;
//获取手机上的导航软件APP列表
class GeoUtil {
static getGeoAppList(){
return GeoModule.getGeoAppList()
}
}
//调用
GeoUtil.getGeoAppList().then(res=>{
console.log(res)
},error=>{
})
原生向RN中发送消息 :
1、创建EventModule类,方法和上面一直
RCT_EXPORT_MODULE(EventModule)
//初始化的时候添加通知中心监听
- (instancetype)init {
if (self = [super init]) {
[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(customEventReceived:) name:EVENT_REMINDER object:nil];
}
return self;
}
//别忘了移除
- (void)dealloc {
[[NSNotificationCenter defaultCenter] removeObserver:self name:EVENT_REMINDER object:nil];
}
//添加支持js监听的事件
-(NSArray<NSString*> *)supportedEvents
{
return @[@"CustomMessage"];
}
#pragma mark --监听
- (void)onTimRefreshNotification:(NSNotification *)no{
[self sendEventWithName:@"IMEventListener" body:@{@"event":@"onRefreshConversation"}];
}
- (void)customEventReceived:(NSNotification *)notification {
NSString *eventName = notification.object[@"name"];
NSString *body = notification.object[@"body"];
//延迟发送
double delayInSeconds = 1.0;
dispatch_time_t popTime = dispatch_time(DISPATCH_TIME_NOW, delayInSeconds * NSEC_PER_SEC);
dispatch_after(popTime, dispatch_get_main_queue(), ^(void){
[self sendEventWithName:@"CustomMessage" body:@{
@"event":eventName,
@"body": body
}];
});
}
2、js端监听,封装一下,创建EventUtil.js文件
import {NativeEventEmitter} from 'react-native'
var eventEmitter = new NativeEventEmitter(EventModule)
class EventUtil{
static addCustomEventListener = (listener) =>{
return eventEmitter.addListener('CustomMessage',listener)
}
}
//使用
componentDidMount() {
this.listener = EventUtil.addCustomEventListener((data)=>{
console.log('Message IMEventListener事件',data)
if(data.event === 'onRefreshConversation' ||
data.event === 'onNewMessageNotification'
){
this.getData()
this.getUnreadCount()
}
})
}
//别忘记移除监听
componentWillUnmount(){
this.listener && this.listener.remove()
}
3、原生需要向RN中发送消息的时候直接通过发通知就可以了
//userInfo是一个字典
[[NSNotificationCenter defaultCenter] postNotificationName:EVENT_REMINDER object:@{
@"name":@"backMessage",
@"body":userInfo
}];
网友评论