谁能解释一下下面的代码？

Question

所以我目前正在审查用 JS 和 Flow-Type 编写的 React-Redux 代码。我对 Flow-Type 的经验很少，所以下面的代码让我有点困惑。

首先我对 redux 部分进行了一些操作。

export type allActions = 
|{|
   +type: "FIRST_ACTION_TYPE",
   +formType: FormType,
   +offset: number,
   +size: number
 |}
|{|
   +type: "SECOND_ACTION_TYPE",
|};

所以我的第一个问题是|{||}|是什么？这个表达式是什么意思？

第二个问题也是针对 FormType 部分的。所以在动作上面有 FormType 的定义。如下图

type FormProps = {
   prop_1?: string,
   prop_2?: number,
   prop_3: number
};

type FormType = RecordOf<FormProps>;

谁能解释一下上面这段代码的作用？

Answer 1

allActions 是一个联合类型，用于类型化 Redux Dispatch。这允许流程在您发送无效操作时抛出错误。

|{|
   +type: "FIRST_ACTION_TYPE",
   +formType: FormType,
   +offset: number,
   +size: number
 |}
|{|
   +type: "SECOND_ACTION_TYPE",
|};

第一个 | 有点令人困惑，但它只是一个可选字符，通常由 lints 在多行联合上添加。它可以被删除并且不会导致错误。

https://flow.org/en/docs/types/unions/

{|...|} 定义一个不能包含任何附加属性的确切对象。它们之间的 | 定义了并集。

https://flow.org/en/docs/types/objects/#toc-exact-object-types

前面的 + 符号将每个属性标记为只读。

表单数据中每个属性后的 ? 符号将每个标记为可选。

recordOf是泛型。我认为它可能是自定义的，也可能是旧版本的流程。

https://flow.org/en/docs/types/generics/#toc-parameterized-generics

谁能解释一下下面的代码？

Can anyone explain a little bit about the code below?

javascript

reactjs

react-redux

flow-typed