Pourquoi «MouseEvent» dans le gestionnaire d'événements de case à cocher n'est-il pas générique?

92

J'ai un élément TSX (JSX) checkbox:

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

Avec l'aide du code VS, je sais que le type de paramètre d'entrée du this.handleCheckboxClickest MouseEvent<HTMLInputElement>. Alors je l'ai implémenté avec:

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

Ensuite, j'obtiens une erreur disant [ts] Type 'MouseEvent' is not generic.comme indiqué dans l'image ci-dessous:

entrez la description de l'image ici

Version de mes packages:

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

Pourquoi donc?

reactjs typescript events types jsx Ben
la source

Réponses:

248

Vous utilisez probablement le DOM MouseEvent. Essayez d'utiliser à la React.MouseEvent<HTMLInputElement>place.

Rossipedia
la source
2
Ne travaille pas pour moi, j'obtiens:type: "checkbox" onChange: (e: MouseEvent<HTMLInputElement>) => void; defaultChec...' is not assignable to type 'InputHTMLAttributes<HTMLInputElement>'
Kokodoko
@Kokodoko avez-vous déjà résolu ce problème?
SuperUberDuper
6

Pour utiliser React MouseEvent, assurez-vous simplement d'ajouter:

import { MouseEvent } from 'react';
Développer l'extrait

Guy Engel
la source
3

Vous pouvez utiliser SyntheticEvent au lieu de MouseEvent

Sras
la source