代码之家  ›  专栏  ›  技术社区  ›  Palisand

特定React本机事件的流类型?

  •  13
  • Palisand  · 技术社区  · 7 年前

    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原生事件是否有任何现有的流类型,或者我必须自己定义它们吗?

    它们似乎分散在代码库中。以下是布局事件类型:

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

    ViewPropTypes.js

    3 回复  |  直到 6 年前
        1
  •  7
  •   marcusstenbeck    5 年前

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

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

    看起来一个好地方是文件夹;

    "react-native/Libraries/Types"

        2
  •  4
  •   Dave Meehan    7 年前

    看看 SyntheticEvent

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

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

    documentation 作为ReactJS中类型的一部分,如果定义了任何一种类型,则应该搜索本机代码库。

    莱兰德·理查森 maintains a Gist 使用RN类型,但这不包括事件。

        3
  •  3
  •   Fabio Crisci    6 年前

    因为它们是在 ViewPropTypes 您可以使用

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