RN笔记-RN跳转原生及数据传递

要实现RN向原生应用传递SectionID,并分别跳转到不同的原生界面,RN提供了NativeModulesInteractionManager接口,在原生应用中需要实现遵守RCTBridgeModule协议的RCT_EXPORT_METHOD跳转方法即可。

1、RN和原生导航功能

要先自己配置RNNavigator和原生的UINavigationController导航功能。这里只贴出原生的导航代码:

// 在appDelegate.h

// 声明一个原生的导航条
@property (nonatomic, strong) UINavigationController *nav;

  // 在appDelegate.m

  // 初始化Nav
  _nav = [[UINavigationController alloc]initWithRootViewController:rootViewController];
  [_nav setNavigationBarHidden:YES animated:YES];
  self.window.rootViewController = _nav;
//  self.window.rootViewController = rootViewController;
  [self.window makeKeyAndVisible];

2、原生项目中新建PushNative类
#import 

// 导入RCTBridgeModule类,这个是react-native提供
#import 

// 遵守RCTBridgeModul协议
@interface PushNative : NSObject

@property (nonatomic, strong) NSString *value;

@end
#import "PushNative.h"
#import 
#import "AppDelegate.h"
// 导入原生跳转页面头文件
#import "HomeworkListViewController.h"
#import "MyReviewsViewController.h"

@implementation PushNative

RCT_EXPORT_MODULE(PushNative)
// RN跳转原生界面
// RNOpenOneVC跳转方法
RCT_EXPORT_METHOD(RNOpenOneVC:(NSString *)msg){
  //这里我传递的是SectionID,分别跳转不同的原生界面
  NSLog(@"RN传入原生界面的数据:%@",msg);
  self.value = msg;
    
    NSInteger jsValue = [_value integerValue];
    switch (jsValue) {
        case 0:
            //必须使用主线程发送 不然有可能失效
            dispatch_async(dispatch_get_main_queue(), ^{
                HomeworkListViewController *vc = [[HomeworkListViewController alloc] init];
                AppDelegate *app = (AppDelegate *)[[UIApplication sharedApplication] delegate];
                [app.nav pushViewController:vc animated:YES];
            });
            break;
        case 1:
            //必须使用主线程发送 不然有可能失效
            dispatch_async(dispatch_get_main_queue(), ^{
                MyReviewsViewController *review = [[MyReviewsViewController alloc] initWithType:[[LoginUserUtil userType] intValue] withStudentId:[LoginUserUtil userId]];
                AppDelegate *app = (AppDelegate *)[[UIApplication sharedApplication] delegate];
                [app.nav pushViewController:review animated:YES];
            });
            break;
        default:
            break;
    }
}

@end

3、RN项目中
  // 导入以下头文件
  NativeModules,
  InteractionManager,
// 声明Push方法 即原生所创建的PushNative类
// 后面一定要一样,前面可以随意定制。
var Push = NativeModules.PushNative;

 // 跳转原生应用
 pushNative(sectionID){
   InteractionManager.runAfterInteractions(()=> {
       // RNOpenOneVC这个也是写在原生PushNative类中
       Push.RNOpenOneVC(sectionID);
   })
 },

  // 调用跳转的方法
    this.pushNative(sectionID)} //最终在这里拿到传递上来的参数
        />

到此,RN跳转原生的方法已经配置完了,Push.RNOpenOneVC(sectionID);即执行了跳转的操作并将SectionID传递给原生。
在原生PushNative.mself.value = msg;即接收到传递过来的数据,通过传递的数据分别跳转不同的原生界面。
需要注意的是,跳转时必须在主线程执行,否则有可能失效。

你可能感兴趣的:(RN笔记-RN跳转原生及数据传递)