特定React Native事件的流类型？

Question

为了flowtype事件,我定义了如下自定义类型:

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

显然,有几个缺少的属性(比如x和width),但我还没有它们.

我试图找到RN的类似类型,但只找到一个Event看起来不是特别有用的类型:

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

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

React Native事件是否有任何现有的流类型,还是我必须自己定义它们？

更新

它们似乎分散在代码库中.这是布局事件类型:

export type ViewLayout = {
  x: number,
  y: number,
  width: number,
  height: number,
}

export type ViewLayoutEvent = {
  nativeEvent: {
    layout: ViewLayout,
  }
}

在ViewPropTypes.js中找到

Answer 1

你需要扮演一点侦探的角色（正如你所注意到的）。以下位置有几种事件类型。

import {type ScrollEvent} from "react-native/Libraries/Types/CoreEventTypes";

看起来不错的地方是文件夹；

"react-native/Libraries/Types"

在任何其他情况下，跳转到源代码并从您尝试为其查找事件的组件进行跟踪。通常，查找类型非常简单，尽管很烦人。

Answer 2

看一下SyntheticEvent类型。PressEvent 和 ScrollEvent 有基本定义。您可以将类型传递给通用 SynthenticEvent 类型来定义您需要的任何其他内容。成员“nativeEvent”获取您的自定义类型。

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

我还没有玩过那么多，但可能很快就会这样做。

ReactJS中有关于这些类型的文档，如果定义了其中任何一个，搜索 Native 代码库应该会出现。

从 v0.53 开始，支持似乎受到限制，因此您可能需要检查您获得的内容并自行推出。

Leyland Richardson维护着 RN 类型的 Gist，但这不包括事件。