redux-saga中 take,takeEvery,takeLatest區別,自己的直白理解

redux-saga中 take,takeEvery,takeLatest區別,自己的直白理解

redux-saga 的時候,對於take,takeEvery,takeLatest的區別比較迷惑,官方的解釋很難理解,然後自己通過寫了例子和看了一些解釋,下面寫一下我的直白理解

先看看官方文檔對於take,takeEvery區別的解釋

  • 在 takeEvery 的情況中,被調用的任務無法控制何時被調用, 它們將在每次 action 被匹配時一遍又一遍地被調用。並且它們也無法控制何時停止監聽。
  • 在 take 的情況中,控制恰恰相反。與 action 被 推向(pushed) 任務處理函數不同,Saga 是自己主動 拉取(pulling) action 的。

從官方文檔看takeEvery是被動的監聽,當制定的action發過來是觸發事件,而take是主動的拉取action,這麼說是很難理解,下面我打幾個比方就很好理解了。

takeEvery

takeEvery就像一個流水線的洗碗工,過來一個髒盤子就直接執行後面的洗碗函數,一旦你請了這個洗碗工他會一直執行這個工作,不會停止接盤子的監聽過程和觸發洗盤子函數

function* 洗碗工() {
    yield takeEvery('髒盤子',function* (action) {
        //一些系列洗碗的過程
        yield put({type:'放盤子',盤子: 新盤子}) //發送一個放新盤子的action
    })
}

所以這個洗碗工可以無限次的接受髒盤子的action,也不會停止洗盤子,所以你沒辦法指定讓他具體洗盤子

takeLatest

takeLatest也就比較好理解了,這個也是一個洗碗工,但是如果他在洗碗的過程中,又收到一個髒盤子,就會把洗到一半的盤子直接丟掉,然後開始洗最新的髒盤子(怪不得老闆總是發現盤子少了)

take

take我們可以想象成一個快遞員,他只負責把髒盤子送過來,至於你要對盤子做什麼他不管,而且他是一次性收費的,送完一次快遞他就走了,所以我們可以具體得安排我們需要幾個髒盤子,你也可以安排先送幾個盤子再一起洗還是送一個洗一個

//收三個盤子再洗
function* 餐盤收集處() {
   while(true) {
       let one = yield take('髒盤子')
       let two = yield take('髒盤子')
       let three = yield take('髒盤子')
       let 一堆盤子 = yield 洗盤子(one,two,three)
       yield put({type:'放盤子',盤子: 一堆盤子}) 
   }
}

//收一個洗一個
function* 餐盤收集處() {
   while(true) {
       let one = yield take('髒盤子')
       let 一個盤子 = yield 洗盤子(one)
       yield put({type:'放盤子',盤子: 一個盤子}) 
   }
}

因爲take方法類似於一次性使用得所以經常和while搭配,可以保持一直監聽得狀態,但是又可以有效的控制流程

發佈了154 篇原創文章 · 獲贊 167 · 訪問量 5萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章