在Redux操作中将数据放入"有效负载"键的优点是什么?

ndb*_*ent 10 javascript reactjs flowtype redux

我没有在任何地方找到一个好的答案,这似乎是一个毫无意义的惯例.在许多教程和文档中,Redux操作定义如下:

{
  type: "ACTION_NAME",
  payload: {
    foo: 123,
    bar: 456,
  }
}
Run Code Online (Sandbox Code Playgroud)

什么是点payload对象?为什么不写这个:

{
  type: "ACTION_NAME",
  foo: 123,
  bar: 456,
}
Run Code Online (Sandbox Code Playgroud)

我正在使用Flow,我喜欢将所有动作类型定义为union,没有嵌套的有效负载:

type Action = {
  type: 'ACTION_NAME',
  foo: number,
  bar: number,
} | {
  type: 'ANOTHER_ACTION',
  someData: string,
} | {
  type: 'ONE_MORE_ACTION',      
  moreData: boolean,
}
Run Code Online (Sandbox Code Playgroud)

我没有payload这么多次打字,我得到了自动完成并对我的所有动作进行了类型检查,所以我不确定我缺少什么.

我没有把所有数据放在一个payload对象中,我错过了一些好处吗?

Dav*_*haw 5

这个惯例被称为Flux Standard Actions,它的动机由Andrew Clark设定为

如果我们可以对它们的形状做出某些假设,那么使用Flux动作要容易得多.例如,基本上所有Flux动作都有一个标识符字段,例如type,actionType或actionId.许多Flux实现还包括用于指示成功或失败的操作的方式,尤其是作为数据获取操作的结果.为这些模式定义最小的通用标准可以创建有用的工具和抽象.

他对FSA的全面建议值得一读.

https://github.com/acdlite/flux-standard-action

简而言之,它使编写中间件(如Sagas)更容易,也可以帮助Reducers处理错误状态.