MeiTuan高仿美團(tuán)客戶端 React-Native 版
這是一個(gè)用React-Native寫的美團(tuán)客戶端。使用了React-Native 0.42版本。遵循ES6語(yǔ)法。主要實(shí)現(xiàn)了美團(tuán)的四個(gè)一級(jí)頁(yè)面（團(tuán)購(gòu)、附近、訂單、我的），以及部分二級(jí)頁(yè)面（團(tuán)購(gòu)詳情、Web頁(yè)面）。
所有功能都是用JavaScript寫的，iOS和Android的代碼復(fù)用率達(dá)到了97%（別問(wèn)我這個(gè)數(shù)字怎么來(lái)的，我瞎掰的）。
這個(gè)Demo的靜態(tài)類型檢查工具使用了Facebook的Flow。它讓我寫JavaScript的時(shí)候，更有安全感。個(gè)人覺得可以用兩個(gè)字形容這個(gè)工具，那就是：灰常牛逼！
我試著讓這個(gè)Demo的結(jié)構(gòu)盡量接近實(shí)際項(xiàng)目，同時(shí)使用比較簡(jiǎn)單方式去實(shí)現(xiàn)功能。這樣可以讓剛接觸ReactNative的人（比如我自己...）更夠容易理解代碼。
所有的JS代碼都在src目錄下。
Paste_Image.png
-
common
通用的工具類 -
img
所有圖片資源 -
scene
所有場(chǎng)景 -
widget
通用的UI控件 -
api.js
網(wǎng)絡(luò)請(qǐng)求的接口 -
RootScene.js
App的主入口，類似iOS中的RootViewController
該項(xiàng)目沒(méi)有使用Redux。因?yàn)閭€(gè)人覺得目前大部分的中小型App并不需要Redux。如果盲目的將Redux添加到項(xiàng)目中，并不能帶來(lái)太多的益處。
魯迅曾說(shuō)過(guò)：
"如果你不知道是否需要 Redux，那就是不需要它。"
Redux的作者 Dan Abramov 說(shuō)過(guò)：
"只有遇到 React 實(shí)在解決不了的問(wèn)題，你才需要 Redux 。"
哦，另外一個(gè)沒(méi)有用Redux的原因，是我還不太會(huì)用。
App的頁(yè)面跳轉(zhuǎn)、TabBar、Navigation，全部通過(guò)第三方的庫(kù)react-native-router-flux實(shí)現(xiàn)。這是一個(gè)非常牛逼的庫(kù)，可以實(shí)現(xiàn)很多自定義的跳轉(zhuǎn)功能。
App中很多頁(yè)面都使用了同一個(gè)網(wǎng)絡(luò)接口，這不是為了讓代碼更加簡(jiǎn)潔，僅僅是我偷懶 >.<
第三方依賴
安裝
-
Clone the repo
$ git clone https://github.com/huanxsd/MeiTuan.git $ cd MeiTuan
-
Install dependencies (npm v3+)
$ npm install
-
Running on iOS
$ react-native run-ios
常見問(wèn)題
Could not connect to development server
打開新的terminal窗口，并執(zhí)行:
$ react-native start
瞎扯蛋
我之前一直在寫Objective-C，但不久前看了ES6的語(yǔ)法和Flex布局方式后，我便馬上愛上了這種開發(fā)方式。
這個(gè)Demo花了大概5天時(shí)間，是我的第一個(gè)ReactNative項(xiàng)目。
如果對(duì)這個(gè)Demo有任何的意見或建議，或者喜歡ReactNative的朋友，歡迎在下方留言。我會(huì)在第一時(shí)間回復(fù) :)
最后
如果你喜歡這個(gè)Demo，請(qǐng)給我一個(gè)star :)
我將持續(xù)更新這個(gè)Demo