原文地址：http://blog.csdn.net/jiaweihaoku/article/details/53259596

 这是一遍关于Android与ReactNative混合开发的探讨文章。

我们项目出现了一个需求，就是点击原生的android按钮跳转到指定的reactNative界面，关于这方面，在网上我是没有找到任何资料，只有通过自己摸索，终于找到了一条走的通的路，如果有大神有更好的办法，可以留言教教我。互相学习进步。

我想到的办法就是点击Android原生按钮向rn传值，rn再通过这个值来跳转到指定的界面。

首先是android跳转rn并传值：

第一步写一个类继承ReactContextBaseJavaModule如下：

[java]  view plain  copy

1. public class IntentModule  extends ReactContextBaseJavaModule {  
2.   
3.     public IntentModule(ReactApplicationContext reactContext) {  
4.         super(reactContext);  
5.     }  
6.   
7.     @Override  
8.     public String getName() {  
9.         return "IntentModule";  
10.     }  
11.       
12.     @ReactMethod  
13.     public void dataToJS(Callback successBack, Callback errorBack){  
14.         try{  
15.             Activity currentActivity = getCurrentActivity();  
16.             String result = currentActivity.getIntent().getStringExtra("data");  
17.             if (TextUtils.isEmpty(result)){  
18.                 result = "没有数据";  
19.             }  
20.             successBack.invoke(result);  
21.         }catch (Exception e){  
22.             errorBack.invoke(e.getMessage());  
23.         }  
24.     }  
25. }  

要注意的是getName方法必须重写

然后再写一个类将这个方法暴露出去，让rn可以调用：

[java]  view plain  copy

1. ublic class AnDataReactPackage implements ReactPackage{  
2.     @Override  
3.     public List createNativeModules(ReactApplicationContext reactContext) {  
4.         List modules = new ArrayList<>();  
5.         modules.add(new IntentModule(reactContext));  
6.         return modules;  
7.     }  
8.   
9.     @Override  
10.     public Listextends JavaScriptModule>> createJSModules() {  
11.         return Collections.emptyList();  
12.     }  
13.   
14.     @Override  
15.     public List createViewManagers(ReactApplicationContext reactContext) {  
16.         return Collections.emptyList();  
17.     }  
18. }  

最后在MainApplication中注册这个类：

[java]  view plain  copy

1.  protected List getPackages() {  
2.         return Arrays.asList(  
3.                 new MainReactPackage(),  
4.                 new AnDataReactPackage()  
5.         );  
6.     }  
7. };  

之后就可以在rn中拿到activity跳转传递的值，值的传递跟普通activity之间的跳转没有差别：

[javascript]  view plain  copy

1. getData() {  
2.       NativeModules.IntentModule.dataToJS((msg) => {  
3.               console.log(msg);  
4.               let base = require('./constant');  
5.               base.columnID = msg;  
6.               //ToastAndroid.show('JS界面:从Activity中传输过来的数据为:' + base.columnID, ToastAndroid.SHORT);  
7.           },  
8.           (result) => {  
9.               ToastAndroid.show('JS界面:错误信息为:' + result, ToastAndroid.SHORT);  
10.           })  
11.   }  

从上面的代码中可以看到我拿到这个值之后存在了常量类里，就是通过这个常量来实现跳转到不同的界面，之后的事情就迎刃而解了：

[java]  view plain  copy

1. componentDidMount() {  
2.       let base = require('./constant');  
3.       //ToastAndroid.show(base.columnID, ToastAndroid.SHORT);  
4.       let id = base.columnID;  
5.       if (id == "3") {  
6.           const { navigator } = this.props;  
7.           if (navigator) {  
8.               navigator.push({  
9.                   name: 'secondPage',  
10.                   component: secondPage,  
11.               })  
12.           }  
13.       }  if (id == "4") {  
14.           const { navigator } = this.props;  
15.           if (navigator) {  
16.               navigator.push({  
17.                   name: 'otherPage',  
18.                   component: otherPage,  
19.               })  
20.           }  
21.       }  
22.   }  

更多相关文章

1. Android(安卓)studio真机模拟调试
2. cocos2dx3.2 Android环境配置
3. 一篇文章看明白 Android(安卓)从点击应用图标到界面显示的过程
4. [置顶] Android基于XMPP Smack Openfire开发IM（2）登录openfire
5. android按home键不能回到自定义主界面
6. Android(安卓)学习笔记之 Activity 简介
7. 配置Android(安卓)SDK 开发环境
8. 【转】Invalidate和postInvalidate的区别
9. Android(安卓)apk快速定位、灰色按钮克星--DroidSword

随机推荐

1. php连接数据库的步骤
2. 使用PHP简单实现类似“畅言”等评论系统
3. php怎么放大字体
4. PHP高效生成一个不重复随机数
5. php无限极分类原理
6. php怎么分页
7. 关于php mysqli函数的一些总结和详细介绍
8. PHP 实现 Snowflake 生成分布式唯一 ID
9. 关于php mysqli函数的一些总结及实例（三）
10. 关于php mysqli函数的一些总结和实例（四）