Warum ist das `MouseEvent` im Checkbox-Ereignishandler nicht generisch?

95

Ich habe ein Kontrollkästchen TSX (JSX) -Element:

<input type="checkbox" name={i.toString()} onClick={this.handleCheckboxClick} />

Mit Hilfe von VS-Code weiß ich, dass der Eingabeparametertyp der this.handleCheckboxClickist MouseEvent<HTMLInputElement>. Also habe ich es implementiert mit:

private handleCheckboxClick(event: MouseEvent<HTMLInputElement>) {
    ...
}

Dann erhalte ich die Fehlermeldung [ts] Type 'MouseEvent' is not generic.Wie im Bild unten gezeigt:

Version meiner Pakete:

"@types/react": "^15.0.29",
"@types/react-dom": "^15.5.0",
"react": "^15.6.1",
"react-dom": "^15.6.1",
"typescript": "^2.3.4",

Warum ist das so?

— Ben
quelle

257

Sie verwenden wahrscheinlich das DOM MouseEvent. Versuchen Sie es React.MouseEvent<HTMLInputElement>stattdessen.

— rossipedia
quelle

2

Ich arbeite nicht für mich und bekomme:

type: "checkbox" onChange: (e: MouseEvent<HTMLInputElement>) => void; defaultChec...' is not assignable to type 'InputHTMLAttributes<HTMLInputElement>'

— Kokodoko

@ Kokodoko hast du das jemals behoben?

— SuperUberDuper

7

Um React MouseEvent zu verwenden, müssen Sie Folgendes hinzufügen:

import { MouseEvent } from 'react';

Erweitern Sie das Snippet

— Guy Engel
quelle

3

Sie können SyntheticEvent anstelle von MouseEvent verwenden

— Sras
quelle