[英]How to refactor redux-saga generator functions?
我是redux-saga和generator函數的新手。
從我的sagas.js代碼中可以看到,有重復的邏輯:
import { put, takeEvery, takeLatest, all, call } from 'redux-saga/effects';
import { setRandomColour, SET_RANDOM_COLOUR_DELAYED } from './actions';
const delay = (ms) => new Promise(res => setTimeout(res, ms));
export function* setRandomColourGeneratorLatest({ payload: { id, ms, sagaType } = {}} = {}){
if(sagaType !== 'takeLatest') return;
console.log("set random colour", id, ms);
yield call(delay, ms);
yield put(setRandomColour(id));
}
export function* setRandomColourGeneratorEvery({ payload: { id, ms, sagaType } = {}} = {}){
if(sagaType !== 'takeEvery') return;
console.log("set random colour", id, ms);
yield call(delay, ms);
yield put(setRandomColour(id));
}
export function* watchSetRandomColourLatest(){
yield takeLatest(SET_RANDOM_COLOUR_DELAYED, setRandomColourGeneratorLatest)
}
export function* watchSetRandomColourEvery(){
yield takeEvery(SET_RANDOM_COLOUR_DELAYED, setRandomColourGeneratorEvery)
}
export default function* rootSaga(){
yield all([
watchSetRandomColourLatest(),
watchSetRandomColourEvery()
])
}
因此,我嘗試通過放置yield調用並將yield放入單個生成器函數中,然后在setRandomColourGeneratorLatest / Every中調用它來重構它,但是無論如何,我都無法使代碼保持運行狀態。 我相信這是因為收益率取決於生成器函數的上一次調用,而在這種情況下,生成器函數必須有2個單獨的版本。
我如何重構此代碼以減少重復的邏輯,同時分離takeEvery和takeLatest版本的收益?
您是否正在尋找這樣的東西? 您的代碼中實際上並沒有太多重復...老實說,它會保留原樣,因為setRandomColourGeneratorLatest和setRandomColourGeneratorEvery之間的通用代碼在某些時候可能會有所不同,因此您必須不進行干燥您的代碼。
import { put, takeEvery, takeLatest, all, call } from 'redux-saga/effects';
import { setRandomColour, SET_RANDOM_COLOUR_DELAYED } from './actions';
const delay = (ms) => new Promise(res => setTimeout(res, ms));
export function* setRandomColourGeneratorLatest({ payload: { id, ms, sagaType } = {}} = {}){
if(sagaType !== 'takeLatest') return;
console.log("set random colour", id, ms);
yield call(setRandomColor, ms, id);
}
export function* setRandomColourGeneratorEvery({ payload: { id, ms, sagaType } = {}} = {}){
if(sagaType !== 'takeEvery') return;
console.log("set random colour", id, ms);
yield call(setRandomColor, ms, id);
}
export function* setRandomColor(ms, id){
yield call(delay, ms);
yield put(setRandomColour(id));
}
export function* watchSetRandomColourLatest(){
yield takeLatest(SET_RANDOM_COLOUR_DELAYED, setRandomColourGeneratorLatest)
}
export function* watchSetRandomColourEvery(){
yield takeEvery(SET_RANDOM_COLOUR_DELAYED, setRandomColourGeneratorEvery)
}
export default function* rootSaga(){
yield all([
watchSetRandomColourLatest(),
watchSetRandomColourEvery()
])
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.