React Native項目--NNHybrid

前言

從事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有幫助！