未定义事件目标值

Question

为什么这是错的？

<input
    id="url"
    type="text" className="form-control"
    value={url}
    placeholder="https://example.com"
    onChange={(e: React.FormEvent<HTMLInputElement>) => this.setState({
        url: e.target.value
    })}
/>

我得到：Property 'value' does not exist on type 'EventTarget'

注意：代码e.target.value没有任何问题。这确实返回了正确的值。我的问题是什么是正确的＆＃34;类型＆＃34;对于此事件，因为React.FormEvent<HTMLInputElement>没有属性event.target.value。

Answer 1

只需使用e.currentTarget.value即可。我甚至不必明确键入e。

currentTarget将始终是您绑定事件的元素; target是您实际点击的内容。有关详细信息，请参阅http://joequery.me/code/event-target-vs-event-currenttarget-30-seconds/。

Answer 2

您应该使用 e.target.value 而不是 (e.target as HTMLInputElement).value。

属性 value 不是在 EventTarget 类型中定义而是在 HTMLInputElement 中定义。

我使用 Angular docs 作为参考。