如何在react-native中跳转原生页面

项目背景：

集成网易云信的sdk，开发了一个原生的即时聊天模块，而项目的整体框架使用react-native开发的，现在需要将这个原生模块集成到项目中。

一、在react-native中跳转原生页面，需要做的几个修改

1）在AppDelegate.h中，创建一个原生的UINavigation导航

2）在AppDelegate.m中，将app的window的rootViewController设置为_nav; 将_nav的rootViewController设置为RN的rootView的，看下图

3）创建一个oc的类，继承自NSObject，实现RCTBridgeModule协议，xxx.h如下

4）xxx.m文件如下：

代码解释：

RCT_EXPORT_MODULE(chatModule); //声明在RN中调用的原生模块的名字，如果这里不声明，则在RN中通过该类名来调用

RCT_EXPORT_Method，原生抛出方法给RN调用，如果原生不抛出方法，则RN无法调用原生方法

NSDictionary *dic 参数，该参数是RN传给原生的，类型可以自己定义，这里定义成字典，是为了方便扩展

dispatch_async(dispatch_get_main_queue(), ^{

       TestViewController *testVc = [[TestViewController alloc]init]

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

      [app.nav pushViewController:vc animated:YES];

  });//因为要做页面跳转，这里最好回到主线程来做；block中则是你想要跳转的代码

5) TestViewController中则按照原生的开发正常开发即可

6）接下来是RN代码中对原生模块的调用，在需要跳转原生页面的地方，

import {NativeModules}from 'react-native'

var chat =NativeModules.chatModule;

chat.openChatViewController({"userId":"abc"});

7）至此，已经可以从RN页面跳转到原生页面了