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

查看SyntheticEvent类型。 PressEvent和ScrollEvent有基本定义。您可以将类型传递给泛型SynthenticEvent类型以定义您需要的任何其他内容。会员＆＃39; nativeEvent＆＃39;获取您的自定义类型。

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

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

在那里的类型中有documentation作为ReactJS的一部分，如果定义了任何这些类型，则应该查找Native代码库。

从v0.53开始看支持是有限的，所以你可能需要检查你得到的东西并自己动手。

Leyland Richardson maintains a Gist有RN类型，但这并不包括事件。

Answer 2

您需要扮演一些侦探（如您所知）。在以下位置有几种事件类型。

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

文件夹看起来很不错；

"react-native/Libraries/Types"

在任何其他情况下，请跳至源代码，然后从您要为其查找事件的组件开始。通常，找到类型非常简单，尽管很烦人。

Answer 3

由于它们是在ViewPropTypes中导出的，因此可以使用

import type { ViewLayoutEvent } from 'react-native/Libraries/Components/View/ViewPropTypes';

特定React Native事件的流类型？

更新

3 个答案: