3

如果我有一个带有 api 调用的异步操作，这可能是一个操作返回一个函数：

export function asyncAction(itemId) {
  return (dispatch) => {
    dispatch(requestStarted());

    return sendRequest(itemId).then(
      (result) =>  dispatch(requestSuccess()),
      (error) =>  dispatch(requestFail())
    );
  };
}

或者返回一个对象并使用中间件拦截它并做一些事情：

export function asyncAction(itemId) {
  return {
    type: [ITEM_REQUEST, ITEM_REQUEST_SUCCESS, ITEM_REQUEST_FAILURE],
    promise: sendRequest(itemId),
    userId
  };
}

// same middleware found in https://github.com/rackt/redux/issues/99
export default function promiseMiddleware() {
  return (next) => (action) => {
    const { promise, ...rest } = action;
    if (!promise) {
      return next(action);
    }

    next({ ...rest, readyState: 'request' );
    return promise.then(
      (result) => next({ ...rest, result, readyState: 'success' }),
      (error) => next({ ...rest, error, readyState: 'failure' })
    );
  };
}

现在我的问题是：如何在调度 asyncAction 之前回滚到状态，这实质上意味着在状态（成功/失败 => 请求）中退回两步，使用 api 调用撤消上一次 api 调用。
例如，删除一个待办事项（这是一个异步操作）后，会显示一个带有撤消选项的弹出式快餐栏，单击它后，已删除的待办事项将被添加回 UI 以及 api 调用以将其添加回数据库。

我试过redux-undo但我觉得它不是为了解决这样的问题。
或者我应该忘记“撤消”并在用户单击撤消选项时发送一个全新的addTodo操作？

提前致谢 ：-）

4

1 回答 1

2

Redux Optimist可能是您所需要的。

于 2015-10-20T14:24:46.990 回答