【React Native】组件库(亲测版)

以下是自己在项目开发过程中使用过的,或者有接触的组件库,记录如下:

---> 导航组件

native-base:React Native的基本跨平台UI组件

---> 导航组件

react-navigation项目中使用过,较为好用;但不同的版本有一定的区别;使用教程

react-native-tab-navigator:未使用过,功能预研时查询到的,暂做记录

react-native-scrollable-tab-view:未使用过,功能预研时查询到的,暂做记录

---> 启动屏

react-native-splash-screen:未使用过,功能预研时查询到的,暂做记录

---> 引导页

react-native-splashscreen:未使用过,功能预研时查询到的,暂做记录

---> 侧滑出布局

react-native-drawer

react-native-side-menu

---> 轮播图

react-native-swiper项目中使用过,较为好用

---> Loading

react-native-overlayer项目中使用过,较为好用

react-native-spinkit

react-native-easy-loading项目中使用过,不建议使用,库底层采用Modal组件渲染视图,同时用state来控制loading的显示隐藏,Modal容易与其他库冲突,state状态渲染界面不及时

---> Toast

react-native-root-toast项目中使用过,较为好用,只是UI美化一般

---> Progress

react-native-progress

---> 弹出对话框

react-native-popup-dialog

react-native-dropdownalert:A simple alert to notify users about new chat messages, something went wrong or everything is ok. It can be closed by tap, cancel button, automatically with closeInterval, pan responder up gesture or programmatically

---> 模态框

react-native-root-modal:未使用过,功能预研时查询到的,暂做记录

react-native-modalbox:A react native component, easy, fully customizable, implementing the 'swipe down to close' feature.

---> 弹出菜单

react-native-popup-menu

---> 颜色渐变处理

react-native-linear-gradient

---> 指定格式的输入框

react-native-masked-text

---> 图片缓存

react-native-img-cache

---> 列表滑动删除

react-native-swipeout

---> 列表下拉刷新

react-native-pull-to-refresh项目中使用过,较为好用

---> 支持拖放的列表

react-native-sortable-listview

---> 图表绘制

react-native-pathjs-charts

---> 饼状图绘制

react-native-pie

react-native-pie-chart

---> 不错的交互效果

react-native-deck-swiper

---> 时间选择器

react-native-date-picker

react-native-date-time-picker

react-native-datereact-native-picker

---> 日历日期选择器

react-native-dates

react-native-calendar-strip

---> 定时器

react-native-timer

---> 键盘遮挡处理

react-native-keyboard-aware-scroll-view

react-native-keyboard-manager:Library to prevent issues of keyboard sliding up and cover inputs on React-Native iOS projects ;This is only for iOS, Android no needed. For Android just add android:windowSoftInputMode="adjustResize" to your activity.

---> 获取设备信息

react-native-device-info项目中使用过,较为好用;使用教程

---> 设备权限检查

react-native-permissions项目中使用过,较为好用;使用教程

---> 获取联系人

react-native-contacts

---> 二维码扫描

---> 二维码生成器

react-native-qrcode-svg

---> 蓝牙

react-native-ble-manager

---> 录音

react-native-audio

---> 视频播放

react-native-video

---> 文件选择

react-native-fs

---> 文件解压

react-native-zip-archive

---> 图片选择及剪裁

react-native-image-crop-picker:iOS/Android image picker with support for camera, video, configurable compression, multiple images and cropping;使用教程

---> 地图

react-native-maps:谷歌地图 项目中使用过,较为好用

react-native-amap3d:高德地图 项目中使用过,较为好用

---> 指纹登录

react-native-touch-id项目中使用过,较为好用

---> 集成微信sdk

react-native-wechat项目中使用过,较为好用

---> 极光推送

jpush-react-native项目中使用过,较为好用;使用教程

---> 友盟推送

react-native-umeng-push

---> sqlite数据库存储

react-native-sqlite-storage

---> 热更新部署

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章