Redux-saga
概述
redux-saga和redux-thunk一樣碉京，是用于處理redux應(yīng)用異步請(qǐng)求的中間件丈咐，reduxsaga通過創(chuàng)建sagas來把所有的異步請(qǐng)求集中處理，方便維護(hù)驱负。本篇文章將講述如何使用redux-saga來處理異步請(qǐng)求戳吝，
項(xiàng)目預(yù)覽地址：需要的小伙伴可以查看頁面
工程部署
項(xiàng)目中redux文件夾就是saga的配置文件，由于項(xiàng)目中沒有多個(gè)state需要管理账磺，所以store里面的數(shù)據(jù)就是我們需要的數(shù)據(jù)。
effects.js?
用于定義effects處理方法痊远，和導(dǎo)出saga監(jiān)聽action處理方法垮抗，effects中fetchTopics方法詳情如下：
注意effects中的方法都是Generator方法，使用同步的寫法來調(diào)用異步請(qǐng)求碧聪，不在使用回調(diào)冒版、async/await等方法來處理，代碼更簡(jiǎn)潔
處理步驟：
1逞姿、調(diào)用redux-saga/effects中的方法 call辞嗡，訪問接口獲取數(shù)據(jù)捆等；
2、接口訪問成功续室，使用redux-saga/effects中的方法put栋烤，發(fā)起action，這里的put方法和dispatch一樣挺狰，都是用于發(fā)起action明郭；
3、put發(fā)起action后丰泊，redux的reducers會(huì)收到action薯定，從而更新state。
reducers.js?
這里的寫法和redux-thunk中reducers寫法一樣
main.js
main.js 中首先加入redux-saga中間件瞳购，用于處理異步請(qǐng)求话侄，這里的sagaMiddleware.run() 方法，主要是啟動(dòng)saga苛败，用于監(jiān)聽actions請(qǐng)求满葛，待匹配到定義的effects type時(shí)，轉(zhuǎn)發(fā)調(diào)用effects方法罢屈，從而處理異步請(qǐng)求
調(diào)用過程：
從打印數(shù)據(jù)中可以看出嘀韧，當(dāng)dispatch一個(gè)action時(shí)，首先進(jìn)入的是reducers方法缠捌，由于type為fetchTopics的action锄贷，saga已經(jīng)注冊(cè)監(jiān)聽，則會(huì)調(diào)用effects中的fetchTopics方法曼月，待異步請(qǐng)求完畢之后谊却，調(diào)用put發(fā)起了一個(gè)新的topics action，所以還是會(huì)進(jìn)入reducers中進(jìn)行處理哑芹。
總結(jié)
redux-saga的使用主要是添加監(jiān)聽炎辨，用于處理自定義的異步處理請(qǐng)求，在將結(jié)果調(diào)用put方法發(fā)起action聪姿，從而交給reducer方法處理碴萧，使得redux異步處理更靈活。
代碼鏈接地址：需要的小伙伴可以下載
如果對(duì)你有幫助末购，勞煩點(diǎn)個(gè)贊吧破喻，謝謝！-V-
