參考案例Shop-React-Native,後端Yii2

Shop-React-Native

Shop-React-Native 是基於 React Native 和 Redux 實現的電商類APP,同時運行在iOS和Android平臺上。持續更新中,歡迎一塊兒討論學習!

若是你支持這個項目,請 Star and Fork Me。

注:有任何問題請在Issues提交,EleTeam會盡快回復。

EleTeam開源項目 - 電商全套解決方案之 React Native 版 - Shop-React-Native。一個相似京東/天貓/淘寶的商城,有對應的服務端支持,由EleTeam團隊維護!

服務端是PHP商城,對應項目是 Shop-PHP-Yii2,https://github.com/EleTeam/Shop-PHP-Yii2

功能以下:

支持下拉刷新和上拖加載更多
廣告模塊
文章模塊
用戶模塊
產品模塊
購物車模塊
訂單模塊
地址模塊
分享&收藏
營銷模塊

依賴組件:

"dependencies": {
    "react": "15.3.1",                      //react框架
    "react-native": "0.33.0",               //react native
    "react-native-device-info": "^0.9.5",   //獲取硬件信息
    "react-native-root-toast": "^1.0.3",    //純JS toast, 用於錯誤提示的小彈窗
    "react-native-swiper": "^1.4.4",        //滑動查看圖片
    "react-native-tab-navigator": "^0.3.3", //純JS底部導航條, 同時適用在iOS和Android上
    "react-native-vector-icons": "^2.0.3",  //圖標庫, 須要更改原生文件的組件, 查看: https://www.npmjs.com/package/react-native-vector-icons
    "react-redux": "^4.4.5",                //將redux跟react應用結合起來
    "redux": "^3.5.2",                      //數據流動的控制
    "redux-persist": "^2.0.1",              //將store對象存儲到本地, 從本地恢復數據到store中
    "redux-thunk": "^2.1.0"                 //redux-thunk

}

訪問在線服務器:html

取消註釋, 在文件: app/common/constants_url.js: 
const kUrlHost = 'http://eleteamapi.ygcr8.com/v1';    //在線服務器

安裝出現問題

1. Application Shop-React-Native has not been registered. This is either due to a require() error during initialization or failure to call AppRegistry.registerComponent
解決辦法:
    形成這種錯誤有兩種狀況:
    1. AppRegistry.registerComponent('項目名', () => 項目名); 與./ios/項目名/appDelegate.m中的RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation moduleName:@"項目名" initialProperties:nil launchOptions:launchOptions]; 不一樣
      在Android項目中多是./android/app/src/main/java/com/項目名/MainActivity.java中的mReactRootView.startReactApplication(mReactInstanceManager, "項目名", null); 沒有保持一致,修改方法:編輯成相同的參數便可。
    2. 有可能你同時在運行一個以上的程序。若是你的react-native在運行程序A而你打開了程序B,也會出現相同的問題。解決方法:關閉其它React Native程序, 只運行一個。

react-native 的學習文檔:

入門基礎: http://reactnative.cn/docs/0.31/getting-started.html
組件的生命週期: http://www.race604.com/react-native-component-lifecycle

部分App界面:

  

  

@author Tony Wongjava

@email 908601756@qq.comreact

@copyright Copyright © 2016 EleTeam. All rights reserved.android

@license The MIT License (MIT)ios

此源碼遵照 The MIT License (MIT),可用於商業上,可是所以帶來的商業損失EleTeam團隊不承擔責任。git

相關文章
相關標籤/搜索