如何获得 Saga 的结果？

Question

假设我有一个带有按钮的模态，如果您单击它，它会发送一个动作。我想知道发送的操作的结果：例如如果成功，我将关闭模态，否则将关闭其他内容。使用 redux-thunk 我的动作看起来像：

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

所以我可以在我的组件中使用结果。但是如何对 redux-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 可以被一个动作调用。我不确定您是如何打开模态框的，但在我们的应用程序中，我们会发送操作来打开和关闭模态框。这样做可以使连接的组件 and 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)
}

如何获得 Saga 的结果？

How to get the result of a Saga?

redux

redux-saga

react-redux