reactjs - TypeScript:属性 'checked' 在类型 'EventTarget & Element' 上不存在。为什么它不存在？

Question

我收到此错误

Error:(17, 35) TS2339: Property 'checked' does not exist on type 'EventTarget & Element'.

但这绝对是不可能的错误，因为 React 文档说 checked确实存在于 target复选框 ( https://reactjs.org/docs/forms.html#handling-multiple-inputs )

这是我的代码。有什么问题让 TS 炸了？

// I specify a type for event. It must have `checked` property.
  onToggle = (ev: React.ChangeEvent) => {
    console.log('[ev]', ev.target.checked); // <= TS throws here
  }

  render() {
    return (
      <div>
        <input type="checkbox" name="switch" id="switch" onChange={ev => this.onToggle(ev)} checked={this.state.on}/>
      </div>
    )
  }

替代错误消息:

TS2339: Property 'checked' does not exist on type 'EventTarget'.

Answer 1

这是一个修复。您必须指定 ChangeEvent 的元素类型

  onToggle = (ev: React.ChangeEvent<HTMLInputElement>) => {
  // onToggle = (ev: React.ChangeEvent) => {
    console.log('[ev]', ev.target.checked); // <= TS throws here
  }

  render() {
    return (
      <div>
        <input type="checkbox" name="switch" id="switch" onChange={ev => this.onToggle(ev)} checked={this.state.on}/>
      </div>
    )
  }