Redux-概念理解

一缝其、Action:是把數(shù)據(jù)傳到store的有效載荷,他是store數(shù)據(jù)的唯一來源徘六。Action本質(zhì)上是普通的JavaScript對(duì)象内边,Action內(nèi)必須包含一個(gè)字符串類型的type字段,來表示要執(zhí)行的動(dòng)作硕噩。

Action創(chuàng)建的函數(shù)假残,就是生成action的方法,在Redux中action創(chuàng)建的函數(shù)只是簡單返回一個(gè)action炉擅。Redux中只需把a(bǔ)ction創(chuàng)建函數(shù)的結(jié)果傳給dispatch()方法即可發(fā)起一次dispatch過程辉懒。store里能直接通過store.dispatch()調(diào)用dispatch()方法,但是多數(shù)情況下會(huì)用react-redux提供的connect()幫助器來調(diào)用谍失。bindActionCreators()可以自動(dòng)把多個(gè)action創(chuàng)建函數(shù)綁定到dispatch()方法上眶俩。

Reducer 就是一個(gè)純函數(shù),接收舊的state和action快鱼,返回新的state颠印。reducer一定要保持純凈,只要傳入?yún)?shù)相同抹竹,返回計(jì)算得到的下一個(gè)state就一定相同线罕。沒有特殊情況,沒有副作用窃判,沒有API請求钞楼、沒有變量修復(fù),單純執(zhí)行計(jì)算袄琳。

function ? todoApp(state=initialState, action) ?{ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?switch(action.type){ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? caseSET_VISIBILITY_FILTER: ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? return ? ?Object.assign({},state, ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? {visibilityFilter:action.filter ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?}) ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?default:returnstate ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? }

注意:1询件、不要修改state,使用Object.assign()新建了一個(gè)副本唆樊,不能像這樣使用:Object.assign(state, {visibilityFilter: action.filter} ) , 因?yàn)檫@會(huì)改變第一個(gè)參數(shù)的值宛琅,你必須把第一個(gè)參數(shù)設(shè)置為空對(duì)象。2逗旁、在default的情況下返回舊的state

combineReducers() 所做的只是生成一個(gè)函數(shù)嘿辟,這個(gè)函數(shù)調(diào)用你的一系列reducer,每個(gè)reducer根據(jù)他們的key來篩選出state中的一部分?jǐn)?shù)據(jù)并處理片效,然后這個(gè)生成的函數(shù)再將所有reducer的結(jié)果合并成一個(gè)大的對(duì)象仓洼。

store:將action和reducer聯(lián)系在一起的對(duì)象。Redux應(yīng)用只有一個(gè)單一的store堤舒,當(dāng)需要拆分?jǐn)?shù)據(jù)處理邏輯時(shí)色建,應(yīng)該使用reducer組合而不是使用多個(gè)store。createStore()用于根據(jù)reducer創(chuàng)建store舌缤,第二個(gè)參數(shù)是可選的箕戳,用于設(shè)置state的初始化狀態(tài)某残。這對(duì)于開發(fā)同構(gòu)應(yīng)用時(shí)非常有用,服務(wù)端redux應(yīng)用的state結(jié)構(gòu)可以與客戶端保持一致陵吸,那么客戶端可以將從網(wǎng)絡(luò)接收到的服務(wù)端state直接用于本地?cái)?shù)據(jù)的初始化玻墅。

數(shù)據(jù)流:嚴(yán)格的單向數(shù)據(jù)流:應(yīng)用中所有的數(shù)據(jù)都具有相同的生命周期。

1壮虫、調(diào)用store.dispatch(action) ?Action就是一個(gè)描述“發(fā)生了什么”的普通對(duì)象澳厢。store.dispatch(action)可以在任何地方調(diào)用。

2囚似、Redux store 調(diào)用傳入的reducer函數(shù)剩拢。store會(huì)把兩個(gè)參數(shù)傳入reducer:當(dāng)前的state樹,和action饶唤。reducer是純函數(shù)徐伐,它僅僅用于計(jì)算下一個(gè)state。它應(yīng)該是完全可以預(yù)測的:多次傳入相同的輸入必須產(chǎn)生相同的輸出募狂。它不應(yīng)該做有副作用的操作办素,如API調(diào)用或路由跳轉(zhuǎn)。這些應(yīng)該在dispatch action 前發(fā)生

3祸穷、根reducer應(yīng)該把多個(gè)子reducer輸出合并成一個(gè)單一的state樹性穿。combineReducers

4、Redux store 保存了根reducer返回完整的state樹雷滚。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末需曾,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子揭措,更是在濱河造成了極大的恐慌,老刑警劉巖刻蚯,帶你破解...
    沈念sama閱讀 211,348評(píng)論 6 491
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件绊含,死亡現(xiàn)場離奇詭異,居然都是意外死亡炊汹,警方通過查閱死者的電腦和手機(jī)躬充,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,122評(píng)論 2 385
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來讨便,“玉大人充甚,你說我怎么就攤上這事“园” “怎么了伴找?”我有些...
    開封第一講書人閱讀 156,936評(píng)論 0 347
  • 文/不壞的土叔 我叫張陵,是天一觀的道長废菱。 經(jīng)常有香客問我技矮,道長抖誉,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,427評(píng)論 1 283
  • 正文 為了忘掉前任衰倦,我火速辦了婚禮袒炉,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘樊零。我一直安慰自己我磁,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,467評(píng)論 6 385
  • 文/花漫 我一把揭開白布驻襟。 她就那樣靜靜地躺著夺艰,像睡著了一般。 火紅的嫁衣襯著肌膚如雪塑悼。 梳的紋絲不亂的頭發(fā)上劲适,一...
    開封第一講書人閱讀 49,785評(píng)論 1 290
  • 那天,我揣著相機(jī)與錄音厢蒜,去河邊找鬼霞势。 笑死,一個(gè)胖子當(dāng)著我的面吹牛斑鸦,可吹牛的內(nèi)容都是我干的愕贡。 我是一名探鬼主播,決...
    沈念sama閱讀 38,931評(píng)論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼巷屿,長吁一口氣:“原來是場噩夢啊……” “哼固以!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起嘱巾,我...
    開封第一講書人閱讀 37,696評(píng)論 0 266
  • 序言:老撾萬榮一對(duì)情侶失蹤憨琳,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后旬昭,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體篙螟,經(jīng)...
    沈念sama閱讀 44,141評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,483評(píng)論 2 327
  • 正文 我和宋清朗相戀三年问拘,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了遍略。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,625評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡骤坐,死狀恐怖绪杏,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情纽绍,我是刑警寧澤蕾久,帶...
    沈念sama閱讀 34,291評(píng)論 4 329
  • 正文 年R本政府宣布,位于F島的核電站拌夏,受9級(jí)特大地震影響腔彰,放射性物質(zhì)發(fā)生泄漏叫编。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,892評(píng)論 3 312
  • 文/蒙蒙 一霹抛、第九天 我趴在偏房一處隱蔽的房頂上張望搓逾。 院中可真熱鬧,春花似錦杯拐、人聲如沸霞篡。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,741評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽朗兵。三九已至,卻和暖如春顶滩,著一層夾襖步出監(jiān)牢的瞬間余掖,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,977評(píng)論 1 265
  • 我被黑心中介騙來泰國打工礁鲁, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留盐欺,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,324評(píng)論 2 360
  • 正文 我出身青樓仅醇,卻偏偏與公主長得像冗美,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子析二,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,492評(píng)論 2 348

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

  • http://gaearon.github.io/redux/index.html 粉洼,文檔在 http://rac...
    jacobbubu閱讀 79,918評(píng)論 35 198
  • 學(xué)習(xí)必備要點(diǎn): 首先弄明白,Redux在使用React開發(fā)應(yīng)用時(shí)叶摄,起到什么作用——狀態(tài)集中管理 弄清楚Redux是...
    賀賀v5閱讀 8,880評(píng)論 10 58
  • 做React需要會(huì)什么蛤吓? react的功能其實(shí)很單一宵喂,主要負(fù)責(zé)渲染的功能,現(xiàn)有的框架柱衔,比如angular是一個(gè)大而...
    蒼都閱讀 14,747評(píng)論 1 139
  • 一樊破、什么情況需要redux愉棱? 1唆铐、用戶的使用方式復(fù)雜 2、不同身份的用戶有不同的使用方式(比如普通用戶和管...
    初晨的筆記閱讀 2,016評(píng)論 0 11
  • 前言 本文 有配套視頻奔滑,可以酌情觀看艾岂。 文中內(nèi)容因各人理解不同,可能會(huì)有所偏差朋其,歡迎朋友們聯(lián)系我討論王浴。 文中所有內(nèi)...
    珍此良辰閱讀 11,898評(píng)論 23 111