react-native結(jié)合dva的使用

前言

最近一版的app使用的是react-native典徘,所以搭個架子總結(jié)下使用到的技術(shù),

希望可以對有興趣入坑的同學(xué)一些幫助益咬。

**## 環(huán)境搭建

請參考react-native中文網(wǎng)

## 運行

安裝依賴包


  yarn

android


  react-native run-android

ios


  react-native run-ios

## dva介紹

dva解決了我們使用redux管理數(shù)據(jù)的那些繁雜的步驟逮诲,它把所有的步驟都整合到一個model文件里,在這個文件里你可以管理你的state,處理你的同步action還有異步action梅鹦,而且還整合了redux-saga裆甩,讓你的異步處理變得更簡潔。美滋滋齐唆!

## react-native如何結(jié)合dva

1.初始化react-native項目

2.yarn add dva-core

3.yarn add react-redux

使用dva-core的原因是因為react-native并不支持react-router v4嗤栓,所以我們并不能使用這個路由,我們只需要dva的核心功能就行了蝶念。作者也是在這個版本中把dva-core給單獨提取了出來抛腕,所以我們只需要調(diào)用create的方法把它給實例化,然后調(diào)用start方法把RN上的路由傳進去就行媒殉。


import React from 'react';

import { create } from 'dva-core';

import { Provider, connect } from 'react-redux';

export { connect };

export default (options) => {

  const app = create(options);

  if (!global.registered) options.models.forEach(model => app.model(model));

  global.registered = true;

  app.start();

  const store = app._store;

  app.start = container => () => (

      {container}

  );

  app.getStore = () => store;

  return app;

};

## react-native如何添加react-navigation

react-navigation是官方推的一個路由担敌,很好用,切換流暢廷蓉,而且兼容ios和android全封。

官方地址

中文參考

## 整合遇到的問題

打包后無法正常運行的情況

1.錯誤的使用dva-no-router,這是react項目使用的,并不適用于rn,改用dva-core + react-redux

2.解構(gòu)失敗: const value = ({}) => { ... }是不允許的桃犬,會報錯


ReactNativeJS: 'Unhandled promise rejection', { [TypeError: undefined is not a function (evaluating 'babelHelpers.objectDestructuringEmpty(r)')]

mac運行出現(xiàn)錯誤


Could not install the app on the device, read the error above for details.Make sure you have an Android emulator running or a device connected and have set up your Android development environment:

https://facebook.github.io/react-native/docs/android-setup.html

解決辦法:

在根目錄下運行:chmod 755 android/gradlew然后就解決了

react-navigation問題

參考

很全很詳細

github地址

個人博客

簡書地址

覺得還行給個star或關(guān)注都行刹悴,感謝開源好世界!T芟尽土匀!

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市形用,隨后出現(xiàn)的幾起案子就轧,更是在濱河造成了極大的恐慌,老刑警劉巖田度,帶你破解...
    沈念sama閱讀 217,734評論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件妒御,死亡現(xiàn)場離奇詭異,居然都是意外死亡镇饺,警方通過查閱死者的電腦和手機乎莉,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,931評論 3 394
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來奸笤,“玉大人惋啃,你說我怎么就攤上這事〗冶#” “怎么了肥橙?”我有些...
    開封第一講書人閱讀 164,133評論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長秸侣。 經(jīng)常有香客問我存筏,道長宠互,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,532評論 1 293
  • 正文 為了忘掉前任椭坚,我火速辦了婚禮予跌,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘善茎。我一直安慰自己券册,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 67,585評論 6 392
  • 文/花漫 我一把揭開白布垂涯。 她就那樣靜靜地躺著烁焙,像睡著了一般。 火紅的嫁衣襯著肌膚如雪耕赘。 梳的紋絲不亂的頭發(fā)上骄蝇,一...
    開封第一講書人閱讀 51,462評論 1 302
  • 那天,我揣著相機與錄音操骡,去河邊找鬼九火。 笑死,一個胖子當(dāng)著我的面吹牛册招,可吹牛的內(nèi)容都是我干的岔激。 我是一名探鬼主播,決...
    沈念sama閱讀 40,262評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼是掰,長吁一口氣:“原來是場噩夢啊……” “哼虑鼎!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起键痛,我...
    開封第一講書人閱讀 39,153評論 0 276
  • 序言:老撾萬榮一對情侶失蹤震叙,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后散休,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,587評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡乐尊,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,792評論 3 336
  • 正文 我和宋清朗相戀三年纺酸,在試婚紗的時候發(fā)現(xiàn)自己被綠了甜滨。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,919評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖策彤,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情币呵,我是刑警寧澤涌穆,帶...
    沈念sama閱讀 35,635評論 5 345
  • 正文 年R本政府宣布,位于F島的核電站独旷,受9級特大地震影響署穗,放射性物質(zhì)發(fā)生泄漏寥裂。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,237評論 3 329
  • 文/蒙蒙 一案疲、第九天 我趴在偏房一處隱蔽的房頂上張望封恰。 院中可真熱鬧,春花似錦褐啡、人聲如沸诺舔。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,855評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽低飒。三九已至,卻和暖如春懂盐,著一層夾襖步出監(jiān)牢的瞬間褥赊,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,983評論 1 269
  • 我被黑心中介騙來泰國打工允粤, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留崭倘,地道東北人。 一個月前我還...
    沈念sama閱讀 48,048評論 3 370
  • 正文 我出身青樓类垫,卻偏偏與公主長得像司光,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子悉患,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,864評論 2 354

推薦閱讀更多精彩內(nèi)容