React Native 类库。以下类库兼容IOS和Android
一.安装类库.安装后在node_modules中找到你刚刚下载的类库,里面有README.md文件,里面有demo教你如何使用,或者里面的js可点开查看所可以设置的属性。具体GitHub上找到该开源类库,里面有详细的说明
npm install 类库名 --save //下载依赖
npm rm 类库名 //删除类库
二.计时器类库
https://github.com/react-native-component/react-native-smart-timer-enhance
三.TabBar底部导航(兼容Android和IOS)--react-native-tab-navigator
下载依赖: npm install react-native-tab-navigator --save
https://github.com/happypancake/react-native-tab-navigator //GitHub地址
四.轮播
这里提供2种:
第一种:
npm install react-native-swiper --save
https://github.com/leecade/react-native-swiper //GitHub
第二种:
https://github.com/archriss/react-native-snap-carousel //GitHub
五.仿QQ侧边栏react-native-side-menu
npm install react-native-side-menu --save
https://github.com/react-native-community/react-native-side-menu //GitHub地址
import SideMenu from "react-native-side-menu";//导入侧边栏. 注意这里要import,官方文档未修改过来
六.级联(类似日期选择,地区选择)react-native-picker
https://github.com/beefe/react-native-picker //GitHub地址
七.原生相册相机操作。
https://github.com/ivpusic/react-native-image-crop-picker //GitHub地址,第三方的react-native-image-crop-picker的功能更为完整易用(可多选、压缩、裁剪等)。
https://my.oschina.net/u/3112095/blog/1552828 //我的开源中国
https://github.com/react-native-community/react-native-camera //功能强大,可以自定义界面,我们可以选择使用哪个摄像头、是拍照还是录像、是否录制声音、是否开启闪光灯、视图比例、拍摄质量、拍摄方向、触摸功能、条形码/二维码扫描等等。
八.时间处理类库--moment
http://momentjs.cn/ //官网地址
npm i moment --save
moment().format("YYYY-MM-DD hh:mm:ss");取当前时间并格式化
九.可以左右滑动的TabBar(可预渲染)
https://github.com/skv-headless/react-native-scrollable-tab-view //GitHub地址
十.RN文件上传(仅ios),下载,创建,删除等文件操作(兼容IOS和Android)--react-native-fs
https://github.com/itinance/react-native-fs //GitHub地址
十一.自定义的模态框
https://github.com/react-native-community/react-native-modal //GitHub地址
十二.指纹认证
https://github.com/hieuvp/react-native-fingerprint-scanner //支持IOS和安卓,GitHub地址
https://github.com/react-native-component/react-native-smart-touch-id //只支持IOS,GitHub地址
https://github.com/naoufal/react-native-touch-id //支持ios的Touch id和Face id
十三.prop-types类型检测
react 15.5起废弃了React.PropTypes.xxx,要用第三方库prop-types。
npm install prop-types --save 安装prop-types的第三方库
再导入:import PropTypes from 'prop-types';
使用这个可以对父组件传到子组件的参数进行类型检测。
比如子组件接受父组件传过来的参数类型要数组,那么父组件就一定要传数组,否则报错。如果数组是array,字符串是string,数字是number等等。isRequired是必须要有这个属性。
import PropTypes from 'prop-types';
class Demo extends Component {
constructor(props){
super(props);
}
//设置固定值。如果值是其他外部的组件传过来的,这里又定义了,那么这里就是默认值,其他组件传过来会覆盖默认值.如果只接收父组件传过来的,默认值可定义也可不定义。
//获取固定值或者获取父组件传过来的值:this.props.name
static defaultProps={
imgData:[]
}
//对父组件传过来的参数进行检测
static propTypes={
imgData:PropTypes.array.isRequired
}
render() {
return(
<View><Text>哈哈哈</Text></View>
)
);
}
}