程序员

RN & iOS 相互调用

2018-04-12  本文已影响1016人  一往情深_b560

RN调用iOS

iOS准备工作:

首先要创建一个Object类PushNative(类名随意,这个是桥接文件),
PushNative.h中导入RCTBridgeModule.h头文件

#import "RCTBridgeModule.h"  
注意: 如果报错:'RCTBridgeModule.h' file not found 可替换为 
#import <React/RCTBridgeModule.h>

接下来遵守RCTBridgeModule协议 如下:

@interface PushNative : NSObject<RCTBridgeModule>
@end

=======================================
PushNative.m中

@implementation PushNative

RCT_EXPORT_MODULE();  // 导出桥接模块   默认模块名为当前class类名即PushNative, 
也可自定义模块名 举个🌰栗子:RCT_EXPORT_MODULE(RNNative);

RCT_EXPORT_METHOD(RNPushToNativeController:(NSString*)message){
        dispatch_async(dispatch_get_main_queue(), ^{
                   ###### 你要实现的原生代码  ######
        });
}
解释👆代码:导出可供RN调用的方法 RNPushToNativeController是方法名、 (NSString*)参数类型、message参数。

以上就是iOS原生端的全部工作,是不是so esay 👍👍👍!!! 

RN调用:

导入原生模块集,它包含iOS端通过RCT_EXPORT_MODULE()导出的所有模块。
import {
   NativeModules
} from 'react-native';

首先获取指定原生模块
let Push = NativeModules.PushNative; 
前面的Push可随意命名,后面的PushNative必须和iOS导出的模块名一致。

调用iOS原生方法
Push.RNPushToNativeController('RN跳转Native');

iOS调用RN

在桥接文件里面进行sendAppEventWithName,RN里面addListener接收( 等同于iOS中的通知中心NSNotificationCenter )

componentDidMount(){
      this.listener=NativeAppEventEmitter.addListener('getSelectDate',(data)=>{
              进行对应的操作,在这里可以跳转页面
      })
}  

至此,大功告成,吃颗糖:) 鼓励一下自己吧👍👍👍!!!

😘😘😘如果觉得对您有帮助,麻烦请点个❤️哦

上一篇下一篇

猜你喜欢

热点阅读