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

时间:2020-08-28 18:36:54

标签: javascript reactjs react-redux flow-typed

因此,我目前正在审查用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>;

任何人都可以解释上面这段代码在做什么吗?

1 个答案:

答案 0 :(得分:0)

allActions是用于键入Redux Dispatch的联合类型。如果您调度无效的操作,这将使流程抛出错误。

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

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

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