0

redux action A 可以将 action B 作为其有效负载吗?

我的用例是我正在尝试存储每个正在进行的 API 请求并将我的 api 状态设置为以下格式:

type ApiState = {
    requests: { [id: string]: AnyAction }
    hasNetwork: boolean
}

属性的键requests基本上type是发起请求的动作(例如USER_FETCH_REQUEST),值是动作(具有类型、有效负载、元数据的整个动作)。我用来过滤以(项目约定)结尾的redux-observable每个动作,然后,如果匹配,则调度一个新动作,该动作接收初始 api 请求动作作为参数(有效负载)并使用它进行更新。type_REQUESTApiState

简单的例子:

const getUser = (id: string) => ({
    type: "USER_FETCH_REQUEST",
    payload: { id }
})

const addRequest = (action: AnyAction) => ({
    type: "API_REQUEST_ADD",
    payload: action
})

// somewhere in epic pipeline ("action" is result of getUser(id))
addRequest(action)

// resulting state
{
    "requests": {
        "USER_FETCH_REQUEST": {
            type: "USER_FETCH_REQUEST",
            payload: { id }
        }
    }
}

这样,如果我的应用程序脱机并且我有 5 个请求ApiState,我只需在保留网络后调度所有这些操作(因为操作应该具有正确完成请求所需的所有数据)。

我也在清除这些请求,_SUCCESS或者_CANCEL有一些自定义逻辑,_ERROR但我只是好奇上面的规范是否是反模式并且会导致不想要的应用程序状态?

4

1 回答 1

0

记录或存储动作列表根本不是反模式。Time Travel,一个非常流行的 redux 用例,正是通过这个实现的。

但是我认为您上面的代码似乎有点过度设计。实现相同结果的更简单的方法是将您的操作修改为这样的

const getUser = (id: string) => {
  const action = {
    type: "USER_FETCH_REQUEST",
    payload: { id }
  }

  add_to_request_cache(action);
  return action;
}

或者,为了让这更容易,写一个动作创建器,比如

const actionCreator = (action: AnyAction) => {
  // Code that handles various types of actions like _REQUEST or _SUCCESS actions
  // add_to_request_cache(action);
  return action;
}

然后用这个包装你所有的动作。

于 2019-09-11T18:40:56.983 回答