參考從react-native中跳轉到自帶的原生頁面幸海,首要的問題就是跳轉,怎么跳轉矾克。
在react-native中提供給了我們Navigator這個組件(相信做過RN開發(fā)的小伙伴都有用到過)刊棕,而原生的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);
//主要這里必須使用主線程發(fā)送,不然有可能失效
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('傳值給原生的數據');
}