FlowType：複数種類の一般的な遺伝

Question

は、それらの両方がid性を有する、2つのデータ型を有する想像：

type Foo = { 
    id: string, 
    // other props 
} 

type Bar = { 
    id: number, 
    // other props 
} 

次にプロパティとしてデータの配列を受け入れ反応させにおけるTable成分を想像します。このコンポーネントは汎用である必要がありますが、データ配列内のすべてのデータオブジェクトに対してidの小道具が必要であることがわかりました。このidは、数値または文字列のいずれかです。小道具は次のようにタイプされるかもしれません：

type Props = { 
    data: Array<{id: number | string}> 
} 

上記の表記は機能しません。特定のプロパティを「再入力」できる方法はありますか？

私はgeneric typesに見ているが、私はFooとBar型定義を変更することなく、解決策を見つけるように見えることはできません。

Answer 1

これはFlowにとって私が思うところではややこしいことです。したがって、両方の型が共有する1つのプロパティを宣言する代わりに、配列をFoo | Barという型として宣言することができます。

これは元のコードよりも繰り返し回数が少なく、そのifステートメントの各ブランチで、他のユニークなプロパティFooまたはBarに何ら問題なく自由にアクセスできます。

// @flow 

type Foo = { 
    id: string, 
    // other props 
} 

type Bar = { 
    id: number, 
    // other props 
} 

type Props = { 
    data: Array<Foo | Bar> 
} 

const foo: Foo = { id: 'A' } 
const bar: Bar = { id: 1 } 
const props: Props = { data: [foo, bar] } 

for (const item of props.data) { 
    if (typeof item.id === 'string') { 
    console.log('I am a Foo') 
    } else { 
    console.log('I am a Bar') 
    } 
} 

Try Flow Link