reactjs - Action 创建者的解释和类型的提取

Question

我正在使用 typescript、react 和 redux 组合一个小应用程序，我遇到了这个叫做 action creator 的小东西。

action creator类代码如下，原创， Prop 去github@plotrwitek;

export class ActionCreator<T, P> {
  readonly type: T;
  readonly payload: P;

  constructor(type: T) {
    this.type = type;
  }

  create = (payload: P) => ({
    type: this.type,
    payload
  });
}

现在，在 reducer 中，我正在实例化这些 action creator，并提取不同的类型，如下所示；

export const ActionCreators = {
  TestAction: new ActionCreator<'TestAction', string>('TestAction'),
};

我使用 Partial<...> 的原因under 是因为它会提示缺少 create属性，存在于类中，但不存在于从 create 返回的内容中方法。

export type Action = Partial<typeof ActionCreators[keyof typeof ActionCreators]>;

我想知道的是以下内容；有人可以解释一下 typeof ...[keyof typeof ...] 是如何产生的吗？工作，如果可能的话；为此提供替代解决方案，以解决缺少的 create property - 一种仅包含来自 create 的可能返回值的类型方法。

谢谢。

Answer 1

tl;dr typeof SomeObject[keyof typeof SomeObject] 的结果类型将是 the union的 SomeObject的值类型。在你的例子中 Partial<ActionCreator<"TestAction", string>> .它基本上是所有现有操作的列表。

---

下面是步骤的解释:

1. typeof ActionCreators : 告诉 TS 使用 const 的类型
2. keyof (1) : 将为您提供 ActionCreators 的所有键的联合类型.在你的情况下，它只有一个:TestAction
3. typeof ActionCreators[(2)]将为您提供所有键的值。它或多或少是在对象上“迭代”并“返回”其值类型。

您使用哪个版本的 TypeScript？删除 Partial 时我没有收到错误消息(使用 TS 2.6.2)。