reactjs - How to describe the ScrollEvent type in React-Native(-Web) via typescript?
问题描述
I can't figure out how to describe the ScrollEvent type in React-Native-Web but I suppose the same is actual for the React Native?
To be honest, it's always a bit hard for me to correctly describe the Event types for the React native (and the standard React as well) because I haven't found any common documentation, etc. about it so I always used
In general, we can use the Generic Synthetic Event and we can pass the definition of the required type into this generic. I guess in my case it must be something like ScrollEvent
but I don't have any idea what exactly should be located there?
I tried to use the standard React.SynteticEvent
type however I received an error
Property 'contentOffset' doesn't exist on type Event
The code example
onScroll={(e: React.SyntheticEvent) => {
let y = 0;
// the scroll data receives differently on mobile and web
if (Platform.OS !== 'web') {
// Property 'contentOffset' doesn't exist on type Event
y = e.nativeEvent.contentOffset.y;
} else {
// Property 'target' doesn't exist on type Event
y = e.nativeEvent.target.scrollTop;
}
if (inputLayout.scrollY !== y) {
setInputLayout({
...inputLayout,
scrollY: y,
});
}
if (isFunction(onScroll)) {
onScroll(e);
}
}}
Many thanks for any help/info/link to the documentation!
解决方案
正确的接口Scroll Event
是UIEvent。
import React, { UIEvent } from 'react';
onScroll={(e: UIEvent<HTMLDivElement>) => {
推荐阅读
- google-tag-manager - 确保正确设置 DataLayer
- r - 从 r (mlr) 中的批标记中提取预测
- android - 如何在 api 级别 16 到 api 级别 28 的 Android 应用程序的后台服务中运行和实现 24/7 通知侦听器
- haskell - 列表列表上的 Haskell 压缩
- php - Symfony 4 - 上传文件的端点
- javascript - TypeError: Object prototype may only be an Object or null: undefined
- java - Eclipse Milo - ClosedChannelException when using SecurityPolicy
- c# - How to round to any number in C#?
- python-3.x - 属性错误:'list' 对象没有属性 'values' 和 TypeError:'str' 对象不支持项目分配
- python - 在 github 和 pypi 上发布新的 python 包版本的最佳工作流程和实践