如何在 react-saga 中协调这种行为？

Question

我正在保存一个实体。

我想触发同步 savePending（针对存储触发 reducer），然后触发异步 save 操作（进行网络调用以进行保存）。

function * saveEntity({ paylpoad: { id, name } }) {
  yield put (savePending()); // triggers a synchronous reducer
  yield put (save()); // triggers an async saga
  yield put (saveComplete());
}

redux-saga 会在继续 save 之前等待 savePending 完成（即 reducer 针对存储完成运行）吗？（大概是的）。

redux-saga 是否会等待 all 个与 put（例如 save）发出的动作关联的 reducers 和 sagas，即使它们是异步的, 在移动到下一个 yield 之前（例如 saveComplete）?

Answer 1

是的，如您所料，一旦 put (savePending()) 效果产生，savePending() reducer 将运行。

另一方面，不，yield put (save()) 调用不会等待保存完成。

我想你有这样的代码：

const save = () => { type: SAVE_ACTION };

function * watchSave() {
  yield takeEvery(SAVE_ACTION, doSave);
}

function * doSave() {
    // [async saving logic]
}

当你 yield 你的 save 动作时，它会触发对你的减速器的调用（如果你的保存动作仅用于触发传奇，它可能什么都不做），但是你没有办法saveEntity saga 等待 saveSaga，它是由 save 操作触发的。

有几种方法可以解决这个问题。一种是这样编写代码：

function * saveEntity({ paylpoad: { id, name } }) {
  yield put (savePending());
  yield call (doSave());
  yield put (saveComplete());
}

通过直接调用 saveSaga()，saveEntity 将等待 saveSaga() 完成后再继续。

另一方面，如果你想保持 saveEntity 和 saveSaga 不那么耦合，你可以让 saveSaga 发出一个 saveEntity 可以监听的动作：

function * watchSave() { /* as before */ }

function * doSave() {
  // [async saving logic]
  yield put(saveCompleted()); // Indicate that the save is completed
}

function * saveEntity({ paylpoad: { id, name } }) {
  yield put (savePending());
  yield put (save());
  // Wait for the saveSaga to be done:
  yield take (saveComplete());
}

如何在 react-saga 中协调这种行为？

How to coordinate this behavior in react-saga?

javascript

redux-saga