React Native项目--NNHybrid

·  阅读 465

前言

从事iOS也有几年,一直就是做原生,没有使用RN这些跨平台的开发方案。也许是最近闲的慌吧,想学一下跨平台方案,在React Native和Flutter之间想了好久,最后贪图RN上手的时间成本可能更少吧,最终觉得还是学RN。

项目介绍

NNHybrid是基于React Native+Redux实现的一个混合开发App,目前只兼容iOS,后续会对功能再进行完善,并且兼容Andriod。

这个项目是用来学习RN的练手项目,我自己也是边看边写的,所以项目还是会有比较多的问题。

项目效果图

项目依赖库

"dependencies": {
  "@react-native-community/async-storage": "^1.3.3",
  "pinyin": "^2.8.3",
  "prop-types": "^15.7.2",
  "react": "16.6.3",
  "react-native": "0.58.6",
  "react-native-device-info": "^1.1.0",
  "react-native-gesture-handler": "^1.1.0",
  "react-native-img-cache": "^1.6.0",
  "react-native-linear-gradient": "^2.5.4",
  "react-native-parallax-scroll-view": "^0.21.3",
  "react-native-root-toast": "^3.0.2",
  "react-native-storage": "^1.0.1",
  "react-native-swiper": "^1.5.14",
  "react-native-vector-icons": "^6.4.2",
  "react-navigation": "^3.3.2",
  "react-navigation-redux-helpers": "^3.0.0",
  "react-redux": "^6.0.1",
  "redux": "^4.0.1",
  "redux-devtools": "^3.5.0",
  "redux-thunk": "^2.3.0",
  "rn-fetch-blob": "^0.10.15"
},
复制代码

项目心得

个人觉得React Native项目开发中倒不是说UI有多难写,使用JS写UI即使再难写,也不会比OC的难写(比如说富文本)。反而是其他几个地方比较头痛或者说刚开始的很不习惯。这里我列举几个:

  • 导航(React-Navigation的使用)
  • React Native与原生通信(原生方面涉及到多线程,JS方面涉及async/await)
  • Redux(单向数据流)

代码传送门最后还是希望这个项目对你学习RN有帮助!

分类:
iOS
标签:
分类:
iOS
标签:
收藏成功!
已添加到「」, 点击更改