前言:
由于前面講解手勢沖突中涉及到OC和RN事件的交互問題腺劣,有的小伙伴不太清楚,我在這里就簡單的介紹幾種使用場景。
準(zhǔn)備:
OC與RN的交互式撼,首先需要?jiǎng)?chuàng)建一個(gè)橋接類(RNBridgeModule)進(jìn)行管理:
RNBridgeModule.h文件
#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>
#import <React/RCTBridgeModule.h>
/**
* RN和iOS/OC橋接模塊
*/
@interface RNBridgeModule : NSObject<RCTBridgeModule>
@end
RNBridgeModule.m文件
#import "RNBridgeModule.h"
#import <React/RCTBridge.h>
#import <React/RCTEventDispatcher.h>
解釋:
如果原生的方法要被JavaScript進(jìn)行訪問踢匣,那么該方法需要使用RCT_EXPORT_METHOD()宏定義進(jìn)行聲明告匠。
該聲明的RNInvokeOCCallBack方法有兩個(gè)參數(shù):
第一個(gè)參數(shù)代表從JavaScript傳過來的數(shù)據(jù),
第二個(gè)參數(shù)是回調(diào)方法,通過該回調(diào)方法把原生信息發(fā)送到JavaScript中离唬。
@interface TTRNBridgeModule ()
@end
@implementation TTRNBridgeModule
@synthesize bridge = _bridge;
RCT_EXPORT_MODULE(TTRNBridgeModule)
#pragma mark --RN調(diào)用OC方法后专,不需要傳值和回調(diào)值
RCT_EXPORT_METHOD(rnCallNativeToMain){
dispatch_async(dispatch_get_main_queue(), ^{
});
}
#pragma mark --RN調(diào)用OC方法,傳值過來和不需要回調(diào)值
RCT_EXPORT_METHOD(rnCallNaticeToReaderBook:(NSDictionary *)dictionary){
TTLog(@"%@",dictionary);
dispatch_async(dispatch_get_main_queue(), ^{
});
}
#pragma mark --RN調(diào)用OC方法输莺,傳值過來和需要回調(diào)值
RCT_EXPORT_METHOD(rnInvokeisLoginCallBack:(NSDictionary *)dictionary callback:(RCTResponseSenderBlock)callback){
NSDictionary *event =@{};
callback(@[[NSNull null], event]);
}
#pragma mark ---下面的方法是OC調(diào)用RN中的方法戚哎,OC與RN的交互中,最麻煩的就是OC調(diào)用RN中的方法了嫂用,我盡量說得明白點(diǎn)吧型凳,如果依然有不理解的,歡迎私信我嘱函!
#pragma mark ---開始訂閱通知事件
RCT_EXPORT_METHOD(refreshViewNotification){
[[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(refreshViewNotificationAction:) name:kNokNotificationNativeRefreshViewNotification object:nil];
}
#pragma mark ---調(diào)用RN上面方法
-(void)refreshViewNotificationAction:(NSNotification *)not{
[self.bridge.eventDispatcher sendAppEventWithName:@"refreshView" body:nil];
}
@end
上面已經(jīng)定義完成了橋接中的方法甘畅,接下來,我們就去看看RN中如何和OC中相互調(diào)用吧
在需要交互的js文件中需要導(dǎo)入下面這個(gè)類
import {
NativeModules,
} from 'react-native';
1往弓、RN調(diào)用OC方法疏唾,不需要傳值
NativeModules.RNBridgeModule.rnCallNativeToMain();
說明:
RNBridgeModule OC中定義的橋接文件的名稱
rnCallNativeToMain() OC橋接中定義的方法名稱
2、RN調(diào)用OC方法函似,傳值過來和不需要回調(diào)值
NativeModules.TTRNBridgeModule.rnCallNaticeToReaderBook(data)
3槐脏、RN調(diào)用OC方法,傳值過來和需要回調(diào)值
NativeModules.TTRNBridgeModule.rnInvokeisLoginCallBack(this.state.book, (error, event) => {
alert(event.passportGid);
});
4缴淋、OC調(diào)用RN中的方法
componentDidMount() {
NativeModules.TTRNBridgeModule.refreshViewNotification();
this.eventManager.init('refreshView', this.getBookdetail);
初始化一個(gè)名稱為refreshView的通知隊(duì)列,
如果觸發(fā)這個(gè)通知隊(duì)列准给,就會調(diào)用this.getBookdetail方法
}
在oc中需要調(diào)用的地方發(fā)送一個(gè)通知
[[NSNotificationCenter defaultCenter]postNotificationName:kNokNotificationNativeRefreshViewNotification object:nil];
總結(jié):
前面幾個(gè)方法可能都很好理解,最后一個(gè)可能有點(diǎn)不好理解重抖,我后面有時(shí)間再上傳一個(gè)demo吧露氮,這個(gè)講解,目前是我覺得最清楚的一種方式了钟沛,