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:

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?

— Ben
source

248

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

— Rossipedia
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
source

3

Vous pouvez utiliser SyntheticEvent au lieu de MouseEvent

— Sras
source