无法从 SyntheticMouseEvent 获取 属性 offsetX

Question

当我尝试从触发的 SyntheticMouseEvent 访问 offsetX 时，Flow 抛出此错误：

[flow] Cannot get event.nativeEvent.offsetX because property offsetX is missing in Event 1. (References: 1)

_handleClick = (event: SyntheticMouseEvent<HTMLDivElement>): void => console.log(event.nativeEvent.offsetX);

我现在唯一的 'workaround' 是将事件键入 MouseEvent:

_handleClick = (event: MouseEvent): SyntheticMouseEvent<HTMLDivElement>

但是如果我没记错的话，React 组件中触发的事件总是 SyntheticEvent，所以我的解决方法是 hack。你知道更好的输入方式吗？

Flow-try（但这不会真正有用，因为未定义 SyntheticMouseEvent）

Answer 1

我不会写 event.nativeEvent.offsetX，而是写 (event.nativeEvent: MouseEvent).offsetX（我在访问 offsetX 之前将本机事件转换为 MouseEvent）。

注意：MouseEvent 来自 dom.js（您不需要导入或要求），参见 https://github.com/facebook/flow/blob/master/lib/dom.js#L284

Answer 2

offsetX 不是 SyntheticMouseEvent 的一部分。在此处查看更多上下文 https://github.com/facebook/react/pull/7011