React Native 学习总结
React Native 学习总结1. 写在前面本次学习笔记是在研究RN(ReactNative缩写)的时候得出的一些感想和使用感受,以一个iOS初级开发人员的角度来记录下来的一些经验。如果有什么不对的,请指正。 在我看来,一个简单的app开发出发需要的是ui,值传递,网络,数据存储,ReactNative在这几个方面的很简单都涉及到了。 2. 简单介绍今年3月份的时候FB发布出来的RN确实是让业界都火了一把,地球人真的是阻止不了前端人员的脚步了。 RN的原理(iOS这边)在我的理解看来其实是用了ios7出来的JavaScriptCore(这个可以深入学习一下)将ReactJS(FB开发出来的语言)转换成iOS原生的代码。也正是这样,RN与Native的接近度才可以这么低。而且相对于NativeScript等等其他的同类型的跨平台语言他的优势在于api会更全,包体积会更小(nativescript的framework 800+M,RN小多了。),而且有FB做后盾,迭代速度会更加快。 我们在学习ReactNative的时候首先要先了解ReactJS,JSX,FlexBox及obj-c(所以说以为只需要学一下RN就可以写移动app的话是很naive的,慢慢学吧。) 本次学习笔记不详细介绍code里面的东西,主要总结一些使用时的思想。 3. 布局FlexBoxhttp://segmentfault.com/a/1190000002658374 这篇文章结合着官方api来学习flexbox的话是可以灰常快的掌握RN的界面布局的。 ReactNative的FlexBox是一个阉割版的FlexBox,所以可以先看下api然后再对你的界面进行设计。 值得一吐槽的是,我们用RN搭出来的页面其实是通过一个一个View“贴”上去的,就像现实一样,越贴就会越厚,那么使用的内存就会越多。可能这是RN的特色吧?(who know?= =),同一个页面,RN写出来的和Native写出来的比较RN的内存会高很多,但跟Native流畅。这也算是一个弊端吧。 我们可以通过FlexBox来实现Autolayout的效果,但SizeClass的话还是算了吧。。。 4. 组件化的UI控件在RN里面,你在屏幕上看到的所有的东西都是一个个的组件。我们在开发的时候也是要组件化来进行开发。 5. 值传递值得一坑的是,RN 在 ReactJS的官方文档里面写到,ReactJS提倡的是正向传值,所以反向传值是没有api的,作为一个iOS的开发者我觉得这个真的是一个坑- -。 6. 网络请求两种方法,fetch 和 XMLHttpRequest ,第一种使用比较方便,第二种功能比较全。详情看:https://facebook.github.io/react-native/docs/network.html#content 7.总结及一些坑https://github.com/ele828/react-native-guide 这个网站里面有所有的学习资料 因为还在迭代中,所以还是很多的坑的例如官方文档跟他给我们的Demo不对应啊示例代码缺失啊神马的是需要一步一步踩过去的,同时还有很多东西还是没有研究出来的,例如navigator在初始化定义后颜色压栈后如果改变颜色啊,tabbar背景颜色的问题啊等等都是暂时无解的,有知道的小伙伴求告知啊。 报着玩的心态去学还是学得挺开心的。 https://rnplay.org/ 这个网站是可以让你在没有mac和iphone的情况下来体验一下如何用ReactNative来写一个移动app的,可惜只有一个js,所以还是老老实实在mac下开发吧。 Demo神马的就不上了。。。 官方Framework里面的Example中的UIExport项目里面的组件给的还是挺全的,可以看看。 暂时写这么多- - 欢迎各位前端大牛进来吐槽。。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |