RN组件应用·代码案例(带运行效果图,仓库不定期推)

一、前言

        其实写博客很枯燥,码字又太累,搞出来一大堆图文跟流水账一样,也不会有多少人看。索性以后风格直接改为走github,这样比较直接,有代码、有效果运行图,而且想什么时候写、什么时候推送,就很随心所欲,只需博客上放个链接即可。

        言归正传,往下看!

         


 

二、Git仓库地址(分支:v0.1.1

GitHub:https://github.com/kobeyk/react-native-example.git

 

clone到本地,执行:

git clone https://github.com/kobeyk/react-native-example.git


 

三、运行效果图

说明:凡是图片,都来源于网络,凡是不涉及网络请求的,数据构建走的都是项目中的静态json数据,如:


(1)Image结合View和Text组件,来一波Nike球鞋展示(九宫格布局)


(2)FlatList结合View、Text、Image、Swiper等组件,走一波技术书籍的"售卖"


(3)SectionList结合View、Text、Image、Swiper等组件,走一波NBA球队球员的分组列表展示


(4)ScrollView结合Image、Text,加上RN自带的fetch组件,实现网络数据的get请求获取相应的数据并展示

备注:macOS系统中,在ios模拟器上调出调试模式,快捷键:command+D

API接口地址:http://demo.itlike.com/web/xlmc/api/homeApi

项目demo实现(部分截图):


(5)其他组件及第三方库的使用,如网络请求axios等,请关注我的github!

原创文章 210 获赞 706 访问量 219万+

猜你喜欢

转载自blog.csdn.net/Appleyk/article/details/105907314