用JavaScript开发移动原生应用,Facebook正式开源React Native!

更新时间:2015-03-30 10:33:26点击次数:2595次

摘要:Facebook正式开源了React Native,不过目前,只有iOS版,Android版还需再等一段时间,这是新的用JavaScript语言开发原生App的尝试。Facebook同时还为React Native开发了一款基于Atom的IDE——Nuclide,也已开源。


在经过前一天Messenger应用平台、Parse物联网开发者工具等惊喜的轰炸,Facebook于今天凌晨在F8开发者大会上正式开源了React Native。不过目前,只有iOS版,Android版还需要再等一段时间,这是新的用JavaScript语言开发原生App的尝试,其示例代码相当简洁,内置控件也不少。同时还为React Native开发了一款基于Atom的IDE——Nuclide,也已开源。



React Native主要特性如下:


原生的iOS组件

React Native主张“Learn once, write everywhere”而非其他跨平台工具一直宣扬的“Write once, run everywhere”。通过React Native,开发者可以使用UITabBar、UINavigationController等标准的iOS平台组件,让应用界面在其他平台上亦能保持始终如一的外观、风格。


[js] view plaincopy在CODE上查看代码片派生到我的代码片

var React = require('react-native'); var { TabBarIOS, NavigatorIOS } =  

    React; var App = React.createClass({ render: function() { return ( <TabBarIOS>  

    <TabBarIOS.Item title="React Native" selected={true}> <NavigatorIOS  

    initialRoute={{ title: 'React Native' }} /> </TabBarIOS.Item>  

    </TabBarIOS> ); }, });  

异步执行

JavaScript应用代码和原生平台之间所有的操作都采用异步执行模式,原生模块使用额外线程,开发者可以解码主线程图像、后台保存至磁盘、无须顾忌UI等诸多因素直接度量文本设计布局。



触摸处理

React Native引入了一个类似于iOS上Responder Chain响应链事件处理机制的响应体系,并基于此为开发者提供了诸如TouchableHighlight等更高级的组件。


[js] view plaincopy在CODE上查看代码片派生到我的代码片

var React = require('react-native'); var { ScrollView, TouchableHighlight,  

        Text } = React; var TouchDemo = React.createClass({ render: function()  

        { return ( <ScrollView> <TouchableHighlight onPress={() =>  

        console.log('pressed')}> <Text>Proper Touch Handling</Text>  

        </TouchableHighlight> </ScrollView> ); }, });  

Facebook在 React Native的主页上详细介绍了React Native的种种功能特性,想要了解更多细节,可直接进入主页查看,而其为React Native搭配的开源IDE Nuclide支持React Native、Web和原生移动开发,基于Atom构建,不过也需要翻墙。



React Native Github托管地址: https://github.com/facebook/react-native

本站文章版权归原作者及原出处所有 。内容为作者个人观点, 并不代表本站赞同其观点和对其真实性负责,本站只提供参考并不构成任何投资及应用建议。本站是一个个人学习交流的平台,网站上部分文章为转载,并不用于任何商业目的,我们已经尽可能的对作者和来源进行了通告,但是能力有限或疏忽,造成漏登,请及时联系我们,我们将根据著作权人的要求,立即更正或者删除有关内容。本站拥有对此声明的最终解释权。

  • 项目经理 点击这里给我发消息
  • 项目经理 点击这里给我发消息
  • 项目经理 点击这里给我发消息
  • 项目经理 点击这里给我发消息