React Native安装第三方组件

791 查看

安装全JS组件


点击进入------->github上搜索组件名称 此处以react-native-root-toast为例
安装跟使用可以参照作者的ReadMe文件,这里贴出安装方法
带$的全是命令行语句,在命令行中不需要输入$

& npm install react-native-root-toast --save

说明: 1.为什么执行该命令就可以直接使用该组件?
因为该组件作者在www.npmjs.com上传过代码,npm安装组件,都会默认去该网站查询并下载
说明: 2.为什么后面要添加 --save?
这样子安装完成后,会在package.js上有一个组件的默认纪录,当你去下载别人源代码的时候,是不会下载node_module的,这时我们需要自己npm install一次,只有Package.js中保存了该纪录,npm install时才会将Toast组件一并下载下来

安装原生组件.


此处以react-native-vector-icons为例
第一步

$ npm install react-native-vector-icons --save

第二步

$ npm install rnpm

第三步:自动连接

$ rnpm link

第三步:手动连接具体看github上的Readme文件

注意点:
如果第三方组件fork后,是没有上传到www.npmjs.com官网的,这时我们安装就要使用github的下载地址。

$ npm install github地址 --save

组件安装与使用


定时器组件使用

// 安装定时器组件
$ npm i react-timer-mixin --save
// 引入定时器
var TimerMixin  = require('react-timer-mixin');

// 注册定时器
mixins : [TimerMixin],

// 使用定时器
this.timer = this.setInterval(function(){    
   //  函数体: ... 逻辑判断
},this.props.duration);

//   停止定时器
this.clearInterval(this.timer);

//  开始定时器
this.startTimer();