RN插件
1、字体库icons npm i react-native-vector-icons --save (要关联 rnpm link)
2、字符串string npm i query-string --save
3、字符串替换lodash npm i lodash --save
4、视频播放video npm i react-native-video --save
5、按钮button npm i react-native-button --save
6、倒计时countdown npm install rn-countdown --save 或者 npm install react-native-sk-countdown@1.0.1 --save (需要修改一下)
7、选择照片picker npm i react-native-image-picker --save (要关联 rnpm link)
8、sha1加密 npm i sha1 --save
9、进度条progress npm i react-native-progress --save
10、uuid npm i uuid --save
11、录音audio npm i react-native-audio --save (要关联 rnpm link)
12、播放声音sound npm i react-native-sound --save (要关联 rnpm link)
13、轮播图swiper npm i react-native-swiper --save
14、immutable不可变数据 npm i immutable --save
15、navigation和redux整合 npm i react-native-navigation-redux-helpers --save
16、navigation导航 npm i react-native-navigation --save
16、navigation导航(现用) npm i react-navigation --save
17、redux数据处理 npm i react-redux --save
18、redux npm i redux --save
19、redux和immutable整合 npm i redux-immutable --save
20、redux和logger打印 npm i redux-logger --save
21、redux和actions动作 npm i redux-actions --save
22、redux和promise npm i redux-promise --save
23、redux和thunk npm i redux-thunk --save
24、获取设备信息组件 npm i react-native-device-info --save
手动添加ART工程依赖
步骤1:
点击iOS工程文件 --》选择Libraries --》Add Files To xx --》选择“项目名“ --》选择node_modules
--》选择react-native --》选择react-native --》选择Libraries --》选择ART --》选择ART.xcodeproj
--》点击 Add
步骤2:
--》选中项目目录 --》Build Phases --》Link Binary With Labraries --》添加ART.a
========================================================================
RN项目启动流程
启动 IOS APP项目-》到项目根目录 -》react-native run-ios
koa服务器启动-》到项目根目录 -》node app
要开启mongo才可以运行
RN 组件
react-native-linear-gradient 颜色渐变处理
react-native-login 视频界面登录
react-native-keyboard-aware-scroll-view 键盘显示处理
react-native-popup-dialog 弹窗
react-native-dropdownalert 一种非常漂亮的alert弹窗方式,从状态栏往下弹窗;
react-native-simple-radio-button 单选按钮;
react-native-swiper
react-native-macos macos桌面应用
react-native-wechat 集成微信相关SDK
react-native-modalbox 模态弹窗
react-native-touch-id 指纹登录
react-native-prompt 可输入文字的弹窗
react-native-sqlite-storage sqlite数据库存储
react-native-permissions 权限检查
react-native-progress-hud loading圈
react-native-snackbar 类似toast的弹窗模式
react-native-qrcode-svg 二维码生产工具
native-base UI组件
react-native-busy-indicator loading圈
react-native-fit-image 图片展示优化
react-native-timer 定时器管理
react-native-scrollable-tab-view 可以左右滑动的tab
react-native-zip-archive 解压工具
react-native-xml2js
react-native-spinkit 好看的loading圈
react-native-interactable 有很强交互效果的table视图
react-native-pull-to-refresh 下拉刷新效果
react-native-deck-swiper 不错的swiper效果
react-native-prefix-picker select效果
react-native-gesture-helper 手势 向上还是向下 还是向左
react-native-drawer-layout 抽屉效果
react-native-sortable-listview 可拖拽排序的列表视图
react-native-progress 进度条 长方形 圆形
react-native-splash-screen 启动屏处理
react-native-masked-text 指定格式的输入框
react-native-keyboard-manager 针对IOS 键盘遮挡的问题 俺可以这么用android:windowSoftInputMode="adjustResize"
react-native-beacons-manager 蓝牙处理
react-native-fetch-blob 文件获取
react-native-popup-menu 弹出菜单
react-native-pathjs-charts 图表
react-native-dates 日历日期选择工具
react-native-calendar-strip 一种简单的日历处理
react-native-simple-markdown 简单的markdown文本编辑器
react-native-image-progress 进度条
react-native-img-cache 图片缓存技术
rn-placeholder 在展示具体的文字和图片之前有个加载样式处理
react-native-pie-chart 饼状图
react-native-maps 地图
react-native-loading-overlay loading圈加载遮罩
react-native-globalize 国际化
react-native-create-bridge CLI工具,轻松地桥接React Native模块和UI组件
react-native-splash-screen 启动白屏优化
react-native-linear-gradient 渐变色
react-native-smart-sortable-sudoku-grid 拖拽1
react-native-sortable-grid 拖拽2
()[https://github.com/react-native-component/react-native-smart-barcode]
React-native-animatable 动画
react-native-carousel 轮播
react-native-countdown 倒计时
react-native-device-info 设备信息
react-native-fileupload 文件上传
react-native-icons 图标
react-native-vector-icons 自定义图标文字
react-native-keychain iOS KeyChain管理
react-native-picker滚轮选择器
react-native-picker-Android Android 滚轮选择器
react-native-refreshable-listview 可刷新列表
react-native-scrollable-tab-view 可滚动标签
react-native-side-menu 侧栏
react-native-swiper 轮播
react-native-video 视频播放
react-native-viewpager 分页浏览
react-native-scrollable-tab-view 可滑动的底部或上部导航栏框架
react-native-tab-navigator 底部或上部导航框架(不可滑动)
react-native-check-box CheckBox
react-native-splash-screen 启动白屏问题
react-native-simple-router 简易路由跳转框架
react-native-storage 持久化存储
react-native-sortable-listview 分类
瀑布流 https://github.com/junhaotong/react-native-waterfall
ListViewreact-native-htmlview 将 HTML 目录作为本地视图的控件,其风格可以定制
React Native 应用在键盘弹出时优雅地响应 https://blog.csdn.net/sinat_17775997/article/details/72953940
{
仿写百思不得姐 https://github.com/spicyShrimp/Misses
React Native 实现瀑布流列表页,分组+组内横向的列表页….. https://blog.csdn.net/spicyshrimp/article/details/80609373
}
React Native电商项目实战——开篇 https://www.jianshu.com/p/2618d8bb0bb0 https://blog.csdn.net/p44w0azwmb3g8au33/article/details/80589180
基于react-native的电商项目iOS端和Android端均可运行,包含类淘宝选择商品,支付宝接入,购物车,瀑布流,省市区选择器等功能
https://github.com/zt1993/ZTShop-React-Native
仿天猫商品类目分类列表页面 https://github.com/guangqiang-liu/react-native-categoryListDemo
react-native-easy-toast 一款简单易用的 Toast 组件(Android&iOS)
选项卡 https://github.com/exponentjs/react-native-tab-navigator
点击打开链接* material组件库(各种漂亮的小组件)https://github.com/xinthink/react-native-material-kit
base组件库(各种封装不错的小组件)http://nativebase.io/docs/v0.4.6/components#anatomyhttps://github.com/GeekyAnts/NativeBase
不错的按钮 https://github.com/mastermoo/react-native-action-buttonhttps://github.com/ide/react-native-button
聊天https://github.com/FaridSafi/react-native-gifted-chat
地图https://github.com/lelandrichardson/react-native-maps
动画https://github.com/oblador/react-native-animatable
加载动画https://github.com/maxs15/react-native-spinkit
抽屉效果https://github.com/root-two/react-native-drawer
https://github.com/react-native-fellowship/react-native-side-menu
图表https://github.com/tomauty/react-native-chart
下拉放大https://github.com/lelandrichardson/react-native-parallax-view
可滑动的日历组件https://github.com/cqm1994617/react-native-myCalendar
语言转化和一些常用格式转换https://github.com/joshswan/react-native-globalize
单选多选ListViewhttps://github.com/hinet/react-native-checkboxlist
选择按钮https://github.com/sconxu/react-native-checkbox
二维码https://github.com/ideacreation/react-native-barcodescanner
制作本地库https://github.com/frostney/react-native-create-library
影音相关https://github.com/MisterAlex95/react-native-record-sound* 安卓
录音https://github.com/bosung90/react-native-audio-android
提示消息的Barhttps://github.com/KBLNY/react-native-message-bar* iOS原生TableViewhttps://github.com/aksonov/react-native-tableview
点击弹出视图https://github.com/jeanregisser/react-native-popover
https://github.com/instea/react-native-popup-menu
3D Touch https://github.com/madriska/react-native-quick-actions
双平台兼容的ActionSheethttps://github.com/beefe/react-native-actionsheet
照片墙https://github.com/ldn0x7dc/react-native-gallery
键盘遮挡问题https://github.com/reactnativecn/react-native-inputscrollview
https://github.com/wix/react-native-keyboard-aware-scrollview
本地存储https://github.com/sunnylqm/react-native-storage
星星https://github.com/djchie/react-native-star-rating
国际化https://github.com/joshswan/react-native-globalize
扫描二维码https://github.com/lazaronixon/react-native-qrcode-reader
https://github.com/react-native-component/react-native-smart-barcode
通讯录https://github.com/rt2zz/react-native-contacts
加密https://www.npmjs.com/package/crypto-js
缓存管理https://github.com/reactnativecn/react-native-http-cache
ListView的优化https://github.com/sghiassy/react-native-sglistview
图片和base64互转https://github.com/xfumihiro/react-native-image-to-base64
安卓 iOS 白屏解决https://github.com/mehcode/rn-splash-screen
Text跑马灯效果https://github.com/remobile/react-native-marquee-label
清除按钮的输入框https://github.com/beefe/react-native-textinput
WebView相关https://github.com/alinz/react-native-webview-bridge
判断横竖屏https://github.com/yamill/react-native-orientation
PDF https://github.com/cnjon/react-native-pdf-view
获取设备信息https://github.com/rebeccahughes/react-native-device-info
手势放大缩小移动https://github.com/kiddkai/react-native-gestures
https://github.com/johanneslumpe/react-native-gesture-recognizers
下拉-上拉-刷新https://github.com/FaridSafi/react-native-gifted-listview
https://github.com/jsdf/react-native-refreshable-listview
https://github.com/greatbsky/react-native-pull/wiki
下拉选择https://github.com/alinz/react-native-dropdown
图片查看https://github.com/oblador/react-native-lightbox
照片选择https://github.com/marcshilling/react-native-image-picker
打开相册 https://github.com/ivpusic/react-native-image-crop-picker
图片加载进度条https://github.com/oblador/react-native-image-progress
轮播视图https://github.com/race604/react-native-viewpager
https://github.com/FuYaoDe/react-native-app-intro
https://github.com/appintheair/react-native-looped-carousel
https://github.com/leecade/react-native-swiper
模态视图https://github.com/maxs15/react-native-modalbox
https://github.com/brentvatne/react-native-modal
https://github.com/bodyflex/react-native-simple-modal
毛玻璃效果https://github.com/react-native-fellowship/react-native-blur
头像库https://github.com/oblador/react-native-vector-icons
滑动选项卡https://github.com/skv-headless/react-native-scrollable-tab-view
自定义js组件(单行多行文本 按钮 分段按钮 滑块 进度条 省市区联动 日历。。。) (demo)
https://github.com/acidb/mobiscroll
---------------------
链接:https://www.jianshu.com/p/5840ea816464
來源:简书
---------------------
可通过下面链接直接搜索你想要的icons
https://ionicframework.com/docs/ionicons/
---------------------
原文:https://blog.csdn.net/jiecsdn/article/details/60867232
---------------------