我实际上正在尝试学习流类型。 在我的 React 应用程序中,我有一个可重用的 TextArea 组件,这是 Prop 声明:
type props = {
fill?: boolean,
large?: boolean,
blue?: boolean,
red?: boolean,
onChange: (
e: SyntheticEvent<HTMLInputElement> & { currentTarget: HTMLInputElement },
) => void,
value: string
};
当我在其他组件中重用它时:
<TextArea value={this.state.note} onChange={this.changeNote} />
changeNote 方法:
changeNote = (
e: SyntheticEvent<HTMLInputElement> & { currentTarget: HTMLInputElement },
) => {
this.setState({ note: e.currentTarget.value });
};
运行流程时出现此错误:
app/components/pages/bills/BillAddPage.js:256
256: <TextArea value={this.state.note} onChange={this.changeNote} />
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ React element `TextArea`
21: e: SyntheticEvent<HTMLInputElement> & { currentTarget: HTMLInputElement },
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ intersection type. Expected polymorphic type instead of. See: app/components/atoms/TextArea.js:21
141: e: SyntheticEvent<HTMLInputElement> & { currentTarget: HTMLInputElement },
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ class type: SyntheticEvent
这有什么问题吗?
最佳答案
您应该使用特定的 SyntheticEvent
相反,像 SyntheticInputEvent
. 🙂
-
SyntheticEvent<T>
事件 -
SyntheticAnimationEvent<T>
对于动画事件 -
SyntheticCompositionEvent<T>
对于 CompositionEvent -
SyntheticInputEvent<T>
对于输入事件 -
SyntheticUIEvent<T>
对于 UIEvent -
SyntheticFocusEvent<T>
对于 FocusEvent -
SyntheticKeyboardEvent<T>
对于键盘事件 -
SyntheticMouseEvent<T>
鼠标事件 -
SyntheticDragEvent<T>
对于 DragEvent -
SyntheticWheelEvent<T>
对于 WheelEvent -
SyntheticTouchEvent<T>
对于 TouchEvent -
SyntheticTransitionEvent<T>
对于 TransitionEvent
关于javascript - react 合成事件的流型错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46644168/