ReactNative探究

一、环境搭建

可以参考http://reactnative.cn/docs/0.43/getting-started.html#content

我选择的window版本（window7 64bit），顺着文档搭建即可。js开发工具采用的是webstorm11

二、嵌入到现有android应用中

参考http://reactnative.cn/docs/0.43/integration-with-existing-apps.html#content，但要注意以下细节：

1、url "$rootDir/../node_modules/react-native/android" 应该为url "$rootDir/node_modules/react-native/android"  （可能程序结构不一样，需要注意）；不然会触发

Failed to resolve : com.facebook.react:react-native:x

2、在android项目目录下执行gradlew installDebug  前需要clean、build（可以命令行执行gradlew clean、gradlew build，也可以在android studio操作）；

3、npm start后需要等出现Loading dependency graph,done.；

4、出现app:processDebugManifest Manifest merger with multiple errors ，一般是app的build.gradle的miniSdkVersion最低版本太低，设置为16即可（AndroidManifest.xml也设置下）；

5、api23移除了httpclient，需要在app的build.gradle中加入

android {
    useLibrary 'org.apache.http.legacy'
}

6、可能会出现support包重复问题（瞧见有support错误信息），解决如下：

我这边是通过配置（app的build.gradle）

    compile ('com.facebook.react:react-native:+'){
        exclude group: 'com.android.support'
    }

在不行可以试试

    compile('com.facebook.react:react-native:+') {
        exclude module: 'recyclerview-v7'
        exclude module: 'support-v4'
        exclude group: 'com.nineoldandroids', module: 'library'
    }

7、Could not get BatchedBridge, make sure your bundle is packaged correctly

可以通过命令行启动packager（和android模拟器或者真机进行交互）adb reverse tcp:8081 tcp:8081 （配置了adb环境变量，我的电脑>右键>属性>高级系统变量>环境变量>系统变量>在path中填入类似路径D:\software\Android\sdk\platform-tools;）

8、Connect to development server 要么执行npm start，要么执行adb reverse tcp:8081 tcp:8081 ；

在开发时，当有js改动的时候，不需要在编译apk，可以自动刷新js，做法可参考：

http://reactnative.cn/docs/0.43/debugging.html#content

用真机进行开发的时候（我用的三星 t805c PAD），在ReactNative页面摇晃pad出现相应操作页面或者执行adb shell input keyevent 82。

9、react-navigation，需要执行npm install --save react-navigation 安装

10、给出一个index.android.js代码例子（包括导航、弹框、列表、Switch按钮等）

环境：android 5.0.2

关于代码中图片等，自己随意建立就行。

git:https://github.com/Springever/Test