ReactNative 和 iOS 交互

原生接收RN传递的数据

效果图

IOS 文件

1. RNToNativeManager.h 文件

#import <Foundation/Foundation.h>
#import <React/RCTBridgeModule.h>
#import <React/RCTLog.h>

@interface RNToNativeManager : NSObject<RCTBridgeModule>
@end

为了实现RCTBridgeModule协议，你的类需要包含RCT_EXPORT_MODULE()宏。这个宏也可以添加一个参数用来指定在Javascript中访问这个模块的名字

2. RNToNativeManager.m 文件

@implementation RNToNativeManager

RCT_EXPORT_MODULE();

/**
 接收RN传过来的 NSString
 @param NSString 字符串
 */
RCT_EXPORT_METHOD(addEvent:(NSString *)name){
NSLog(@"接收传过来的NSString+NSString: %@", name);
}

/**
 接收RN传过来的 NSString + dictionary

 @param NSString 字符串
 @param NSDictionary 字典
 @return
 */
RCT_EXPORT_METHOD(addEventTwo:(NSString *)name DetailData:(NSDictionary *)data){

   NSLog(@"接收到RN传递过得string + dictionary ,%@,%@ ",name,data);
}


/**
 接收RN传过来的 NSString + date日期

 @param NSString 字符串
 @param NSDate data数据
 @return <#return value description#>
 */
RCT_EXPORT_METHOD(addEventThree:(NSString *)name Date:(NSDate *)date){
  NSDateFormatter *formatter = [[NSDateFormatter alloc] init] ;
  [formatter setDateFormat:@"yyyy-MM-dd"];
  NSLog(@"接收传过来的NSString+NSDictionary: %@ %@", name, [formatter stringFromDate:date]);
}


 /**
 接收RN传过来的 callback

 @param NSString 字符串
 @return <#return value description#>
 */
RCT_EXPORT_METHOD(TextCallBackOne:(NSString *)name CallBack:(RCTResponseSenderBlock)callback){
NSLog(@"%@",name);

NSArray *arr = @[@"1",@"2",@"3",@"4",];
// [NSNull null] 返回RN用来判断
callback(@[[NSNull null],arr]);
}


//Promises

/**
对外提供调用方法,演示Promise使用（resolve block回调出去的值id）

 @param TextCallBackTwo <#TextCallBackTwo description#>
 @param RCTPromiseResolveBlock <#RCTPromiseResolveBlock     description#>
 @return <#return value description#>
 */
RCT_REMAP_METHOD(TextCallBackTwo, Resolver:(RCTPromiseResolveBlock)resolve Rejecter:(RCTPromiseRejectBlock)reject){

NSArray *arr = @[@"5",@"6",@"7",@"8",];
  if (arr) {
      resolve(arr);
  }else{
      NSError *error;
      NSString *message = @"这是错误信息。。。。";
      reject(@"199",message,error);

    }
}

-(NSDictionary *)constantsToExport{
    return @{@"first":@"Native"};
}

ReactNative

_One(){
    RNToNativeManager.addEvent('这是RN 到原生的值');
}
_two(){
    RNToNativeManager.addEventTwo('这是RN 到原生的值',{rn:'这是字典'});
}
_three(){
    RNToNativeManager.addEventTwo('这是RN 到原生的值',20170607);
}
_textCallback(){
    RNToNativeManager.TextCallBackOne(('这是RN 到原生的值'),(error,events)=>{
     if(error){
         console.log(error);
     }  else{
        alert(events);
     }
    })
}
//Promise回调
async _CallbackTwo(){
    try{
        var evevts = await  RNToNativeManager.TextCallBackTwo();
        console.log(evevts);

        // alert(events)
    }catch (e){
        console.log(e);

    }
}

_constantsToExport(){

    console.log(RNToNativeManager.first);

}

_randerContent(){
    return(
        <View style = {styles.container}>
            <View style = {styles.navigator}>

            </View>

            <View style = {[styles.center]}>
                <Text style = {styles.textStyle} onPress = {this._One}>把值带给原生界面 string</Text>
                <Text style = {styles.textStyle} onPress = {this._two}>把值带给原生界面 string + dic</Text>
                <Text style = {styles.textStyle} onPress = {this._three}>把值带给原生界面 string + date</Text>
                <Text style = {styles.textStyle} onPress = {this._textCallback}>把值带给原生界面 string + 回调 </Text>
                <Text style = {styles.textStyle} onPress = {this._CallbackTwo}>把值带给原生界面 Promise回调 </Text>
                <Text style = {styles.textStyle} onPress = {this._constantsToExport}>把值带给原生界面 + native </Text>


            </View>




        </View>

    )
}

  render() {
  return(

    this._randerContent()
  )
}

交互文件

1.首先获取AppDelegate 中的导航控制器，
2.push到对应的控制器

RCT_REMAP_METHOD(pushDataEvent,
             Resolvor:(RCTPromiseResolveBlock)resolv
             Rejector:(RCTPromiseRejectBlock)reject
              ){

AppDelegate *delegate = (AppDelegate *)[UIApplication sharedApplication].delegate;

NSLog(@"%@",delegate.window.rootViewController);
//跳转界面
//主要这里必须使用主线程发送,不然有可能失效
dispatch_async(dispatch_get_main_queue(), ^{
    UINavigationController *navi = (UINavigationController *)delegate.window.rootViewController;

    QRCodeViewController *pushVC = [[QRCodeViewController alloc] init];
    pushVC.popBlock = ^(NSString *urlStr) {
        if (urlStr) {
            resolv(urlStr);
        }else{
            reject(@"199",@"没有链接",nil); 
        }
    };
    [navi pushViewController:pushVC animated:YES];
});
}

demo地址
参考文章 rectnative 中文网