React Redux Saga事件频道取消



是否有任何可能通过redux传奇中的副作用取消EventChannel的副作用的方法?

给定一个连接到外部事件/数据流的eventChannel,在这种情况下,Firebase实时数据库"child_added"事件:

// action
const types = { SYNC: 'SYNC_TODOS' };
function syncTodos(todos) {
    return { types: types.SYNC, todos }
}
// saga
function todosChannel() {
  // firebase database ref
  const ref = firebase.database().ref('todos/');
  const channel = eventChannel(emit => {
    const callback = ref.on('child_added', (data) => {
      emit({ snapshot: data, value: data.val() })
    });
    // unsubscribe function
    return () => ref.off('child_added', callback);
  });
  return channel;
}
function* sync() {
  const channel = yield call(todosChannel);
  try {
    while (true) {
      const { value } = yield take(todosChannel);
      yield put(actions.syncTodos(value));
    }
  }
  finally {
    if(yield cancelled()) {
      channel.close();
    }
  }
}
export default function* rootSaga() {
  yield fork(sync);
}

有什么方法可以使用有效的侧面,例如fork(),诸如takevery()之类的东西来聆听以取消事件频道的操作并停止收听firebase "child_added" CC_3事件/数据流?还是这需要以某种方式保存对频道的引用并在频道参考本身上执行cancel()?

感谢您提供的任何帮助。

您的意思是?

function* sync() {
  const channel = yield call(todosChannel);
  yield takeEvery(channel, function*({value}){
    yield put(actions.syncTodos(value))
  }
  yield take('CANCEL_WATCH')
  channel.close();
}

顺便

我必须修改所接受的答案方法,以捕获我的频道中发出的错误。我也更喜欢处理叉子中的取消,而不是像接受答案一样处理值。

function* sync() {
  const channel = yield call(todosChannel);
  yield fork(function* () {
    yield take('CANCEL_WATCH')
    channel.close();
  })
  try {
    while (true) {
      const { value } = yield take(channel)
      yield put(actions.syncTodos(value))
    }
  }
  catch (error) {
    yield put(actions.cancelWatch()) // to emit 'CANCEL_WATCH'
    yield put(actions.errorTodos(error))
  }
}

最新更新