美文网首页
RN页面跳转到iOS原生控制器

RN页面跳转到iOS原生控制器

作者: 豆汁儿还是豆花儿 | 来源:发表于2020-08-26 14:58 被阅读0次

参考从react-native中跳转到自带的原生页面,首要的问题就是跳转,怎么跳转。
在react-native中提供给了我们Navigator这个组件(相信做过RN开发的小伙伴都有用到过),而原生的iOS也提供了UINavigationController,所以想要跳转,我们就需要用到这两个东西。

本质还是ios中进行跳转,RN调原生暴露的跳转功能方法即可

ios原生

ToolPushNative.h文件

#import <Foundation/Foundation.h>
#import <React/RCTBridgeModule.h>
@interface ToolPushNative : NSObject<RCTBridgeModule>
@end

ToolPushNative.m文件

#import "ToolPushNative.h"
// 导入跳转的页面
#import "ToolsViewController.h"
@implementation ToolPushNative
RCT_EXPORT_MODULE(ToolPushNative)
// RN跳转原生界面
// RNOpenToolsVC指的就是跳转的方法,下面会用到
RCT_EXPORT_METHOD(RNOpenToolsVC:(NSString *)msg){
  
  NSLog(@"RN传入原生界面的数据为:%@",msg);
  //主要这里必须使用主线程发送,不然有可能失效
  dispatch_async(dispatch_get_main_queue(), ^{
    ToolsViewController *toolsVC = [[ToolsViewController alloc]init];
    toolsVC.hidesBottomBarWhenPushed = NO;
    //获取当前的导航控制器(我这里是从二级控制器页面加载RN,然后返回一级控制器)。也可利用UIApplication获取
   UIViewController*rootvc = [self getCurrentVC];
    [rootvc.navigationController popViewControllerAnimated:NO];
    
//    AppDelegate *app = (AppDelegate *)[[UIApplication sharedApplication] delegate];
//    [app.nav pushViewController:toolsVC animated:YES];
  });
}

RN中

1.需要导入NativeModules

// 看到 PushNative 是不是很熟悉,没错这个就是原生中写的那个类
// 后面一定要一样哦,前面可以随意定制。
var Push = NativeModules.ToolPushNative;

2.跳转

goBackNative = () => {
        Push.RNOpenToolsVC('传值给原生的数据');
    }

相关文章

网友评论

      本文标题:RN页面跳转到iOS原生控制器

      本文链接:https://www.haomeiwen.com/subject/nraxsktx.html