Flowtype - ciąg niekompatybilny z ciągiem enum

Question

Mam wartość, która pochodzi z wejścia select i jest typu string, jednak chcę przekazać go do funkcji (updateLanguage), która otrzymuje jako argument wyliczenie łańcuchowe z typem alias (Język).

Problem mam skierowane jest to, że umożliwia przepływ tylko mnie zadzwonić updateLanguage gdybym wyraźnie porównać moją wartość z ciągów enum i chcę użyć funkcji array jak array.includes.

Jest to uproszczenie kodu mojego problemu:

// @flow 

type SelectOption = { 
    value: string 
}; 
const selectedOption: SelectOption = {value: 'en'}; 

type Language = 'en' | 'pt' | 'es'; 
const availableLanguages: Language[] = ['en', 'pt']; 

function updateLanguage(lang: Language) { 
    // do nothing 
} 

// OK 
if(selectedOption.value === 'en' || selectedOption.value === 'pt') { 
    updateLanguage(selectedOption.value); 
} 

// FLOWTYPE ERRORS 
if(availableLanguages.includes(selectedOption.value)) { 
    updateLanguage(selectedOption.value); 
} 

działa v0.30.0 przepływu daje następujący wynik:

example.js:21 
21: if(availableLanguages.includes(selectedOption.value)) { 
     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ call of method `includes` 
21: if(availableLanguages.includes(selectedOption.value)) { 
            ^^^^^^^^^^^^^^^^^^^^ string. This type is incompatible with 
    9: const availableLanguages: Language[] = ['en', 'pt']; 
           ^^^^^^^^ string enum 

example.js:22 
22: updateLanguage(selectedOption.value); 
     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ function call 
22: updateLanguage(selectedOption.value); 
         ^^^^^^^^^^^^^^^^^^^^ string. This type is incompatible with 
11: function updateLanguage(lang: Language) { 
            ^^^^^^^^ string enum 


Found 2 errors 

Jak mogę sprawdzić, że ciąg znaków jest częścią enum w skalowalny sposób?

Answer 1

Oto skalowalne i bezpieczne rozwiązanie:

const languages = { 
    en: 'en', 
    pt: 'pt', 
    es: 'es' 
}; 

type Language = $Keys<typeof languages>; 

const languageMap: { [key: string]: ?Language } = languages; 

function updateLanguage(lang: Language) { 
    // do nothing 
} 

type SelectOption = { 
    value: string 
}; 
const selectedOption: SelectOption = {value: 'en'}; 

if(languageMap[selectedOption.value]) { 
    updateLanguage(languageMap[selectedOption.value]); 
}