react-native中第三方组件的使用技巧

96
nextChallenger
2017.06.23 15:05* 字数 1390

最近很多朋友会问到一些很基础的第三方组件的问题.所以今天写一下自己踩坑中积累的一些经验.方便入门级同学参考.

目前react-native更新到0.45版本,相对于原生的生态来讲,react-native的生态差距很大,第三方组件良莠不齐.大家在开发工程中,不免需要用到第三方组件,怎么样快速的找到适合自己的组件,怎么去判断好不好用,提高自己的工作效率是一个很大的问题.

我自己在使用第三方组件的经验大致如下:

1.根据需求关键字搜索组件名称;

2.新建空项目,根据文档,了解组件的特性和局限性,判断是否满足个人需求;

3.选定组件,将其使用到自己的项目中;

一.搜索组件

大家在开发过程中,遇到官方没有的组件,怎么样去寻找自己需要的组件呢?

以一个常见的日期组件为例:

1.百度/Google.

内事不决问百度,外事不决问谷歌.搜索大法好.

直接简单粗暴 搜索日期组件常用的词汇,拼接上react native 关键字 "react native datePicker",基本上多点开几个网上大神们得推荐的组件,都能找到几个不错的组件了.

这种方式信息量比较大,需要自己挨个辨别,需要有一定的信息过滤能力.用得多了也可以提高自己的信息过滤能力.


2.github/npm

https://github.com/

https://www.npmjs.com/

这俩是神器一般的网站啊.

同样简单粗暴,想好关键字 搜索栏搜索

这种方式搜索结果信息定位更精准,github里往往可以通过star很直观的反馈出一个组件的质量和大家的认可度,也可以通过更新日期,获取到当前比较活跃的组件.由于每个人的需求都不太一样,有时候star不是很多的,看起来很冷门的组件,也能带给你惊喜.而且内置文档,example.!!!!!!强烈推荐此种方式.

npmjs.很好很强大,也是神器一样的网站,但是我是从iOS转过来的,习惯了github,npmjs用的比较少,了解不多.暂时没有体会到个中精髓,用法基本类似github.有了解的同学欢迎留言回复补充.


3.混技术群,群内口头搜索.

这个方法肯定大家也经常使用,在此打个广告吧.给大家推荐我比较熟悉的三个群吧,都不是我的群

QQ群:397885169  这个群是最活跃的群,群内学习氛围最好,大神很多,大家聊天很愉快,群主目前在维护识兔开源APP.识兔APP源码地址 大家还在讨论有时间的在搞几个.暂未施行.

QQ群:496325710  这个群里面大神很多,群内 大大 同学是开源APP IReading的作者IReading源码,目前这个群很少有人活跃了.可能大家都很忙吧.

QQ群:245192933 这个群是我最早加的一个群 ,大神也有很多.

以上三个群都推荐给真正有需求想学习rn的同学,如果您仅仅是一时兴起,了解一下,进群以后也不说话,没多久就把消息改成接受不提醒,或者不接受群消息的.网上的资料其实就很满足需求了.

二.了解组件特性

爬坑的经历告诉我,不了解的组件千万不要轻易集成到组件中.简单的组件还好,直接把依赖删除,把相关文件删除即可,复杂的牵扯到原生集成的组件,一旦发现不好用,移除的时候很容易出现问题.很费精力.比如我使用codepush这个库,集成的时候,很麻烦,鼓捣了好久,后来发现可能导致一些问题,移除的时候,又鼓捣了好久.耗时耗力不讨好.

所以,在选定组件以后,建议大家init一个新项目,单独用来展示该组件本身,了解一下各个属性的特点,值类型,需要注意的地方等等...确认可以满足自己的需求了,就可以放进项目里面直接使用了.有一些不满足项目需求的地方,可以在demo里面尝试修改源码,快速修正效果使得满足自己的需要.然后可以将组建集成到项目内,然后依照demo源码的修改,同步修改项目内的源码,磨刀不误砍柴工,这句话还是很有道理的.

一般需要了解的主要以下几个部分:

1.组件布局方式

2.属性

3.数据格式

4.方法(参数){返回值}

ps:也有一些组建直到在项目中使用的时候才会暴露出一些与其他组件冲突,或者数据之间,动画效果有冲突的问题,这种问题暂时避免不了,只能放进项目里一点点改了.

三.选定组件,将其使用到自己的项目中

如果了解了组建的特性了,知道怎么使用了,就可以根据文档说明,将组件使用到自己的项目中了

react-native