如何获得 Saga 的结果？

Question

假设我有一个带有按钮的模式，如果你点击它，它就会调度一个动作。我想知道发送的动作的结果：例如如果它成功了，我将关闭模态并关闭其他方式。 使用 redux-thunk 我的操作看起来像：

export const deleteObjects = () => {
  return (dispatch, getState) => {
    try {
      ...
      dispatch(setObjects([]));
      return true
    } catch (e) {
      return false
    }
  }
};

所以我可以在我的组件中使用结果。但是如何对 redux-sagas 做同样的事情呢？据我所知，您可以将 sagas 与观察者一起使用。 我能想到的一种解决方案是将回调函数传递给动作创建者并在 saga 内部调用它。像这样：

export const deleteObjects = (callback) => ({
  type: DELETE_OBJECTS,
  callback
});

export function* deleteObjectsAsync({callback}) {
  try {
    ...
    put(setObjects([]))
    yield call(callback, true)
  } catch (err) {
    yield call(callback, false)
  }
}


function* watchGetPlaces() {
  yield takeEvery(DELETE_OBJECTS, deleteObjectsAsync)
}

这是一个有效的解决方案还是有更合适的方法？

Answer 1

我不推荐您提出的解决方案。传递回调函数是 redux-saga 试图阻止开发人员必须处理的精确事情之一。

一个干净的解决方案是将您的模态关闭功能包装到它自己的 saga 中，该 saga 可以由操作调用。我不确定您是如何打开模态的，但在我们的应用程序中，我们会发送动作来打开和关闭模态。这样做可以使连接的组件和 sagas 可以操纵任何模式。 Sagas 旨在处理副作用。关闭模式是一个副作用。因此，saga 是放置关闭模态逻辑的理想场所。

看看这个样板：

export const closeModal = () => ({
  type: CLOSE_MODAL,
});
function* onCloseModal() {
  // Your logic for closing modals goes here
}
function* closeModalSaga() {
  yield takeEvery(CLOSE_MODAL, onCloseModal)
}

export const deleteObjects = () => ({
  type: DELETE_OBJECTS,
});
export function* deleteObjectsAsync() {
  try {
    ...
    yield put(setObjects([]))
    yield put(closeModal());
  } catch (err) {
    // Your "do-something-else" logic here
    // I'd recommend dispatching another action
  }
}
function* watchGetPlaces() {
  yield takeEvery(DELETE_OBJECTS, deleteObjectsAsync)
}