Question

我的商店有bag和favorites。目前有REMOVE_FROM_BAG的操作。这会触发一个副作用，从API中删除包中的项目，该API会调度实际将其从商店中删除的REMOVE_FROM_BAG_COMPLETE。

我们正在添加一项操作MOVE_FROM_BAG_TO_FAVORITES，该操作会从bag中移除一个项目并将其放入favorites。如果删除API调用失败，则不应继续其他任何操作。整体流程将是：

MOVE_BAG_TO_FAVORITES
REMOVE_FROM_BAG
@Effect Api Call
REMOVE_FROM_BAG_COMPLETE
ADD_TO_FAVORITES

因此，如果Api呼叫失败，则不应将该项目从行李商店移除或添加到您的收藏夹列表中。

// REMOVE_FROM_BAG side effect; API call; success removes item from the store
@Effect()
removeFromBag = this.actions$
  .ofType(REMOVE_FROM_BAG)
  .switchMap(({ payload }) => this.bagService.remove(payload)
    .map(() => ({ type: REMOVE_FROM_BAG_COMPLETE, payload })
    .catch(() => of({type: REMOVE_FROM_BAG_FAIL }))
  );

至于将项目移动到收藏夹，我也可以触发REMOVE_FROM_BAG作为副作用，但我不确定如何确定副作用是否成功（即链接它）。

@Effect()
moveFromBagToFavorites = this.actions$
  .ofType(MOVE_FROM_BAG_TO_FAVORITES)
  .mergeMap(({ payload }) => [
    { type: REMOVE_FROM_BAG, payload },
    { type: ADD_TO_FAVORITES, payload },
  ]);

理论上这应该可行，但我不确定如果ADD_TO_FAVORITES因API调用失败而失败，如何防止REMOVE_FROM_BAG被调度。是否有更好的方法来链接有副作用的行为？

Answer 1

不纯效果调用比纯粹的reduce调用更容易失败。

所以我会先调用你的效果：

@Effect Api Call -- Effect
API_CALL_COMPLETE -- Redux (should change state)
  MOVE_BAG_TO_FAVORITES -- Redux
  REMOVE_FROM_BAG -- Redux
  REMOVE_FROM_BAG_COMPLETE -- Not necessary anymore
  ADD_TO_FAVORITES -- Redux

如果API调用失败，则不需要回滚。

链效应依赖于其他效果的结果

1 个答案: