如何在已有的iOS APP原生代码中整合React Native

ReactNative结合了Web应用和Native应用的优势，可以使用JavaScript来开发iOS和Android原生应用。在JavaScript中用React抽象操作系统原生的UI组件，代替DOM元素来渲染等。ReactNative使你能够使用基于JavaScript和React一致的开发体验在本地平台上构建世界一流的应用程序体验。ReactNative把重点放在所有开发人员关心的平台的开发效率上——开发者只需学习一种语言就能轻易为任何平台高效地编写代码。Facebook在多个应用程序产品中使用了ReactNative，并将继续为ReactNative投资。其好处显而易见：减少了人力、节省了时间、避免了iOS与Android版本发布的时间差，开发新功能可以更迅速。下面，我们可以尝试用ReactNative创建一个iOSAPP.在我们开始之前，我建议：你可以在Github里先下载ReactNative的代码框架。里面还有一些示例项目，2048的游戏，Movies（一个看电影的APP）,SampleApp,TicTacToe(一款游戏)和UIExplorer（能显示出所有用ReactNative替代的控件，如ListView，TabBar，MapView,Slider）），对于学习用如何用ReactNative创建UI,这些都是非常好的例子,尤其是UIExplorerAPP，它几乎用到了每一个您的APP中需要创建的UI控件。首先，我们先来安装相应的工具。Reactnative是使用Node.js来创建JavaScript代码。如果你已经在你电脑上安装上了这些工具，你可以跳过下面这几步。推荐使用Homebrew的方式来安装nvm，watchman和flow。在Mac下，如果用homebrew，那么只用一行就可以装好:brewinstallnode接下来安装watchmanbrewinstallwatchmanwatchman是Facebook的一个文件观察者。ReactNative用它来检测代码的变化.接下来安装npmnpminstall-greact-native-clinmp是node的一个三方管理工具，相当于Ruby中的RubyGems，iOS中的CocoaPods，Java中的Gradle/Maven，基本上，它使您能够轻松下载和管理你的项目需要的任何依赖库。在终端，找到你希望保存的项目文件，然后运行下面的文件夹。react-nativeinitBookSearch以上使用CLI工具来构建一个Native项目，是准备建立并运行原样。当这个过程完成后，你就会在终端窗口中打开Xcode的BookSearch.xcodeproj并运行应用程序像往常一样。做到这一点，模拟器将启动您的应用程序的运行。一个终端窗口也将打开。当一个Native应用程序启动时，它加载从以下网址JavaScript的应用程序。e:{fontSize:20,textAlign:'center',margin:10,},instructions:{textAlign:'center',color:'#333333',marginBottom:5,},});上面的样式应用可于视图的内容。如果你做过web开发或用过CSS（层叠样式表），在此之前这应该是熟悉的。ReactNative使用CSS样式应用程序的UI。如果你看看JSX代码，你会看到不同风格的代码被用在不同的地方。例如:style={style.container}设置样式定义容器的外部视图包含其他UI组件。上面的样式应用可于视图的内容。如果你做过web开发或用过CSS（层叠样式表），在此之前这应该是熟悉的。ReactNative使用CSS样式应用程序的UI。如果你看看JSX代码，你会看到不同风格的代码被用在不同的地方。例如:style={style.container}设置样式定义容器的外部视图包含其他UI组件。