In order to flowtype events, I define custom types like the following:
export type OnScrollEvent = {
nativeEvent: {
contentOffset: {
y: number
},
contentSize: {
height: number
}
}
}
Obviously, there are several missing properties (like x
and width
), but I have no need for them yet.
I have tried to locate similar types for RN but only found an Event
type that does not seem to be particularly useful:
import type {Event} from "react-native";
handleEvent = (e: Event) => console.log(e.inexistentProperty) // Flow doesn't care!
Are there any existing flow types for React Native events or do I have to keep defining them myself?
They seem to be scattered around the code base. Here's the layout event type:
export type ViewLayout = {
x: number,
y: number,
width: number,
height: number,
}
export type ViewLayoutEvent = {
nativeEvent: {
layout: ViewLayout,
}
}
found in ViewPropTypes.js
Since they are exported in ViewPropTypes
you can use
import type { ViewLayoutEvent } from 'react-native/Libraries/Components/View/ViewPropTypes';
You'll need to play a bit of detective (as you've noticed). There are a few event types in the following location.
import {type ScrollEvent} from "react-native/Libraries/Types/CoreEventTypes";
And it looks like a good place to look is the folder;
"react-native/Libraries/Types"
In any other case, jump into the source code and follow from the component you're trying to find the event for. Usually it's pretty straightforward, although annoying, to find the type.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With