項目背景：

集成網(wǎng)易云信的sdk，開發(fā)了一個原生的即時聊天模塊，而項目的整體框架使用react-native開發(fā)的，現(xiàn)在需要將這個原生模塊集成到項目中。

一、在react-native中跳轉(zhuǎn)原生頁面，需要做的幾個修改

1）在AppDelegate.h中，創(chuàng)建一個原生的UINavigation導(dǎo)航

2）在AppDelegate.m中，將app的window的rootViewController設(shè)置為_nav; 將_nav的rootViewController設(shè)置為RN的rootView的，看下圖

3）創(chuàng)建一個oc的類，繼承自NSObject，實(shí)現(xiàn)RCTBridgeModule協(xié)議，xxx.h如下

4）xxx.m文件如下：

代碼解釋：

RCT_EXPORT_MODULE(chatModule); //聲明在RN中調(diào)用的原生模塊的名字，如果這里不聲明，則在RN中通過該類名來調(diào)用

RCT_EXPORT_Method，原生拋出方法給RN調(diào)用，如果原生不拋出方法，則RN無法調(diào)用原生方法

NSDictionary *dic 參數(shù)，該參數(shù)是RN傳給原生的，類型可以自己定義，這里定義成字典，是為了方便擴(kuò)展

dispatch_async(dispatch_get_main_queue(), ^{

? ?? ? TestViewController *testVc = [[TestViewController alloc]init]

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

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

? });//因為要做頁面跳轉(zhuǎn)，這里最好回到主線程來做；block中則是你想要跳轉(zhuǎn)的代碼

5) TestViewController中則按照原生的開發(fā)正常開發(fā)即可

6）接下來是RN代碼中對原生模塊的調(diào)用，在需要跳轉(zhuǎn)原生頁面的地方，

import {NativeModules}from 'react-native'

var chat =NativeModules.chatModule;

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

7）至此，已經(jīng)可以從RN頁面跳轉(zhuǎn)到原生頁面了