摘要：仿又來了又寫了一個，別急呀，我可沒上次寫的代碼這是用寫的基本界面都已經實現，當然了，有些地方圖省事搞不定追求速度寫的，就自然會導致退而求其次的實現方式代碼結構可能不太規范清晰可能還有呢我不聽我不聽項目地址我的個人主頁盡管風光無限幾乎對各大

又寫了一個《ONE》，別急呀，我可沒copy上次寫的代碼~

這是用ReactNative寫的《ONE》

基本界面都已經實現，當然了，有些地方圖省事(搞不定) + 追求速度寫的Demo，就自然會導致：

退而求其次的實現方式

代碼結構可能不太規范/清晰

可能還有bug呢(我不聽我不聽)

項目地址 => https://github.com/liuzho/ONE-RN

我的個人主頁 => https://liuzho.com

盡管Kotlin風光無限幾乎對各大社區進行了屠版，但我還是冒著被淹沒的風險把這個Demo發出來了，萬一有人看呢(逃..

沒事，ReactNative自有魅力！(各種技能全給你學了管你誰有魅力).....

如果你初學RN，那么幫助可能有限，請你點個贊/點個star，以備后續學習

如果你是RN大牛，那么請你點個贊/點個star，慢慢看，慢慢嘲諷我

如果你有一丟丟RN基礎，想練練手，那么請你點個贊/點個star，反正你也學不到啥略略略~~~

當然了，國際慣例，甩預覽圖：

你需要這樣做：

git clone https://github.com/liuzho/ONE-RN.git

cd ONE-RN

npm install//切記不要用cnpm！親測cnpm導致無法運行

react-native run-ios or react-native run-android

理論上iOS(測試可用，部分組件如ToastAndroid不通用報黃)和Android都可以運行

    "react": "16.0.0-alpha.6",
    "react-native": "0.44.0",
    "react-navigation": "^1.0.0-beta.9"

StackNavigator / TabNavigator的使用

你能看到的：底部Tab(TabNavigator)、第一個Tab內類似viewPager滑動(TabNavigator)、跳轉到用戶/搜索等界面(StackNavigator)

為什么不用ViewPagerAndroid來實現第一個Tab內的滑動呢，因為這個組件在iOS不能用啊...GitHub應該有通用組件，我沒有去找，用TabNavgation算了吧

組件信息傳遞props / nav的router攜帶數據params這些

抽取了一個Toolbar組件，title的顯示通過props/router搞定，StackNavigator的router(項目內appNavigation)通過props瘋狂傳遞給各個界面/組件    

通用控件的抽取

Toolbar、CdView等一些組件的抽取(我沒有刻意去做這件事，可能有些應該抽取的控件我并沒有很好的抽取出來)

動畫Animated

我承認其實就一個假循環旋轉動畫....CdView點擊按鈕旋轉，以前總結過Animated知識點現在全忘了...

WebView加載網頁并插入JS代碼

Detail頁面的內容，由于想快點完成Demo，也覺得界面寫也就是一樣的，就沒自己實現，直接用了WebView加載相應的WebApp頁面，然后通過`webView.injectJavaScript`插入我的JS代碼，將內容中頭部和底部一些不需要的地方全部通過`Element.reoveChild`給移除掉了

ListView、fetch使用

關于ListView、fetch的使用我有寫過一篇文章：[ReactNative網絡fetch數據并展示在listview中](http://www.jianshu.com/p/22de6734d858)

那么為什么我沒有在這個基礎上實現下拉刷新、上拉加載、headerView、footerView呢？因為有一個FlatList完全支持這些做法！那又為什么我沒有用FlatList呢？！因為在我發現FlatList的時候為時已晚，我已經不想再修改之前寫了的代碼了....[FlatList中文文檔](http://reactnative.cn/docs/0.44/flatlist.html#content)

還有其他一些我一時也想不起來，你覺得都用到了啥？T_T求不打

感謝API哥們兒？這次你還冒出來不？

API：戳這里=>**[ONE的API](https://github.com/jokermonn/-Api/blob/master/ONEv3.5.0~.md)**

注：若侵犯《ONE》權利，我將及時刪除所有相關內容

我將保持更新/優化一段時間，畢竟還有一些細節沒完成，還有挺多需要優化的地方

更多內容歡迎訪問我的主頁或我的博客

覺得本文/本Demo對你有所幫助，請不要忘了點一下文末的"?"讓他變成"?"

當然，也別忘了Star一下我的倉庫 => ONE-RN

學習就是耐住寂寞不斷踩坑，多動手敲就能有更多的知識經驗和肩椎脊柱受損T_T