Как указать один из двух реквизитов, необходимых в Flowjs?

Question

У меня есть различные компоненты React, которые могут иметь разную функциональность при передаче различных реквизитов. Часто я сталкиваюсь с какой-либо ветвящейся логикой, где присутствует prop1, сделайте одно, но если prop2 присутствует, сделайте что-нибудь еще.

Одним из примеров может быть два обработчика изменений для элемента с входом, который принимает разные аргументы.

Есть ли способ указать в Flowjs, что требуется один из двух обработчиков?

Answer 1

К счастью, аннотацию типа потока, которую вы хотите, можно применять в контекстах, выходящих за рамки Реагирования. В общем, если вы хотите, исключающее или типа проверки вы можете сделать следующее:

type Something = { 
    prop1: number, 
    prop2?: null 
} 

type Another = { 
    prop1?: null, 
    prop2: number 
} 

function foo(parameter: Something | Another) { 

} 

foo({ prop1: 10 }); // Good 
foo({ prop2: 10 }); // Good 
foo({ prop1: 10, prop2: 10 }); // Bad 

Если вы хотите инклюзивное или тип проверки, вы можете сделать это:

type Something = { 
    prop1: number, 
    prop2?: null 
} 

type Another = { 
    prop1?: null, 
    prop2: number 
} 

type SomethingAndAnother = { 
    prop1: number, 
    prop2: number 
} 

function foo(parameter: Something | Another | SomethingAndAnother) { 

} 

foo({ something: 10, prop1: 10 }); // Good 
foo({ something: 10 }); // Bad 
foo({ prop1: 10 }); // Good 
foo({ prop2: 10 }); // Good 
foo({ prop1: 10, prop2: 10 }); // Good 

В React, можно определить тип на props собственности, например, так:

class TodoList extends React.Component { 
    props: Something | Another; 

    render(): React.Element { 
    return (
     // .... 
    ) 
    } 
}