[Redux] redux-saga effect
19390 ワード
takeは、特定のタイプの動作を待つ、すなわち、動作が送信される前に次のコードに移動しない: .は、その動作がオブジェクト に戻るのを待つ.は、複数の動作 を待つことができる.
◆最初に実行した動作の対象を返し、ある動作を実行した場合は次のコードへある動作が実行されると、その動作が秒数以内に実行されない場合、関数は実行されます.
ex)FIRST ACTION動作が発生した後、0.5秒以内にFIRST ACTIONが発生しなければfirstAction関数を実行し、FIRST ACTION動作が発生してから0.5秒以内にFIRST ACTIONが発生した場合、再び0.5にリセットし、0.5秒以内にFIRST ACTION動作が実行されなければ、この動作 を実行する.
throttle
特定の動作を実行すると、その秒内に実行される同じ動作は無視されます
遅延期間において、この動作は最大1回のを実行することができる.ある関数がcancleによって中断する場合、中断した関数内でfinally構文を使用すると、中断してもfinally構文に入るため、いくつかの動作 を中断して実行することができる.降伏キャンセル(task)タスク完了を待たない
race
遅延運転終了の影響キャンセルキャンセルの効果finally文でキャンセル収益率()を使用してキャンセルすると、特定の動作 が発生します.サードパーティ関数を配列形式でパラメータに入れると、サードパーティ関数がすべて解析されるまで並列に同時に実行されるのを待つ. の効果が拒否されると、すべての効果が自動的にキャンセルされます. join forkタスクの終了を待つ
fork
並列
◇パラレル効果でエラーが発生した場合、待機中のすべての効果はキャンセルされます
actionChannel(action,buffer) 特定の動作をキューに入れる、*バッファ を順番に処理する.
eventChannel外部イベントチャネル を購読できます.
const somethingSuccess = yield take(ACTION_TYPES.SOMETHING_SUCCESS);
console.log("somethingSuccess 액션이 실행되었습니다.");
◆最初に実行した動作の対象を返し、ある動作を実行した場合は次のコードへ
const somethingActions = yield take([ACTION_TYPES.FIRST_SUCCESS,ACTION_TYPES.SECOND_SUCCESS]);
if(somethingActions.type === 'ACTION_TYPES.FIRST_SUCCESS'){
console.log("firstSuccessAction");
}else {
console.log("secondSuccessAction");
}
アクションシーンが待っていますconst [fistSuccessAction, secondSuccessAction] = yield all([
take(ACTION_TYPES.FIRST_SUCCESS),
take(ACTION_TYPES.SECOND_SUCCESS),
]);
console.log("firstSuccessAction,secondSuccessAction");
debounceex)FIRST ACTION動作が発生した後、0.5秒以内にFIRST ACTIONが発生しなければfirstAction関数を実行し、FIRST ACTION動作が発生してから0.5秒以内にFIRST ACTIONが発生した場合、再び0.5にリセットし、0.5秒以内にFIRST ACTION動作が実行されなければ、この動作
import {debounce} from 'redux-saga/effects';
function* firstAction(action:ReturnType<typeof firstAction >){
...
};
function* saga(){
yield all([...,debounce(500,FIRST_ACTION,firstAction)])
}
debouncing throttle
特定の動作を実行すると、その秒内に実行される同じ動作は無視されます
遅延期間において、この動作は最大1回のを実行することができる.
import { throttle } from 'redux-saga/effects'
function* handleInput(input) {
// ...
}
function* watchInput() {
yield throttle(500, 'INPUT_CHANGED', handleInput)
}
cancle
function* authorize(user, password) {
try {
...
return token
} catch(error) {
yield put({type: 'LOGIN_ERROR', error})
} finally {
if (yield cancelled()) {
// ... put special cancellation handling code here
}
}
}
function* loginFlow() {
while (true) {
const {user, password} = yield take('LOGIN_REQUEST')
// fork return a Task object
const task = yield fork(authorize, user, password)
const action = yield take(['LOGOUT', 'LOGIN_ERROR'])
if (action.type === 'LOGOUT')
yield cancel(task)
yield call(Api.clearItem, 'token')
}
}
cancledrace
遅延運転終了の影響キャンセル
const {posts, timeout} = yield race({
posts: call(fetchApi, '/posts'),
timeout: delay(1000)
}) // 1초안에 posts 실행이 끝나지 않으면 posts는 취소됌
if (posts)
yield put({type: 'POSTS_RECEIVED', posts})
else
yield put({type: 'TIMEOUT_ERROR'})
allfork
function* fetchAll() { // 1초가 지나고, task1과 task2가 마친 뒤에야 fetchAll 종료 됨
const task1 = yield fork(fetchResource, 'users')
const task2 = yield fork(fetchResource, 'comments')
yield call(delay, 1000)
}
callfunction* fetchAll() { // task1이 종료되고 task2이 종료되고 1초가 지나야 fetchAll 종료 됨
const task1 = yield call(fetchResource, 'users')
const task2 = yield call(fetchResource, 'comments')
yield call(delay, 1000)
}
並列
◇パラレル効果でエラーが発生した場合、待機中のすべての効果はキャンセルされます
function* fetchAll() { // task1과 task2이 종료되어야 다음 코드로 넘어가고 1초가 지나야 fetchAll 종료 됨
yield [call(fetchResource, 'users'), call(fetchResource, 'comments')];
yield call(delay, 1000)
}
actionChannelconst somethingActhionChannel = yield actionChannel(ActionTypes.SOMETHING)
**takeEveryは、特定のアクションが発生するたびに、特定のアクションに対してすべてのプライベート関数を実行しますが、順番に実行されることは保証されません.eventChannel
Reference
この問題について([Redux] redux-saga effect), 我々は、より多くの情報をここで見つけました https://velog.io/@harim/Redux-redux-saga-effectテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol