Typ przepływu dla konkretnych wydarzeń natywnych React?

Question

W celu flowtype zdarzenia, definiować typy niestandardowe jak następuje:

export type OnScrollEvent = { 
    nativeEvent: { 
    contentOffset: { 
     y: number 
    }, 
    contentSize: { 
     height: number 
    } 
    } 
} 

Oczywiście, istnieje kilka właściwości brakuje (jak x i width), ale nie mam potrzeby ich jeszcze.

Próbowałem zlokalizować podobne typy dla RN ale tylko znaleźć typ Event które nie wydają się być szczególnie przydatne:

import type {Event} from "react-native"; 

handleEvent = (e: Event) => console.log(e.inexistentProperty) // Flow doesn't care! 

czy są jakieś istniejące typy przepływu przez React Native wydarzenia czy muszę sam je definiować?

Answer 1

Spójrz na typ SyntheticEvent. Istnieją podstawowe definicje dla PressEvent i ScrollEvent. Możesz przekazać typ do ogólnego typu SynthenticEvent, aby zdefiniować wszystko, czego potrzebujesz. Element "nativeEvent" otrzymuje niestandardowy typ.

function handler(e: SyntheticEvent<CustomType>): void { 
    // e.nativeEvent... 
} 

Jeszcze nie grałem z tak dużą ilością, ale prawdopodobnie wkrótce to zrobię.

Istnieje documentation jako część ReactJS na typach tam, i wyszukiwanie Native codebase powinno pojawić się, jeśli którekolwiek z nich są zdefiniowane.

Wygląda na to, że wsparcie jest ograniczone do wersji v0.53, więc możesz sprawdzić, co otrzymasz i przetasować.

Leyland Richardson maintains a Gist z typami RN, ale nie obejmuje to zdarzeń.