¿Por qué el `MouseEvent` en el controlador de eventos de la casilla de verificación no es genérico?

92

Tengo un elemento de casilla de verificación TSX (JSX):

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

Con la ayuda del código VS, sé que el tipo de parámetro de entrada de this.handleCheckboxClickis MouseEvent<HTMLInputElement>. Entonces lo implementé con:

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

Luego [ts] Type 'MouseEvent' is not generic.aparece un error que dice como se muestra en la imagen a continuación:

Versión de mis paquetes:

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

¿Porqué es eso?

— Ben
fuente

248

Probablemente estés usando DOM MouseEvent. Intente usar en su React.MouseEvent<HTMLInputElement>lugar.

— rossipedia
fuente

2

No funciona para mí, obtengo:

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

— Kokodoko

@Kokodoko, ¿alguna vez arreglaste esto?

— SuperUberDuper

6

Para usar React MouseEvent solo asegúrese de agregar:

import { MouseEvent } from 'react';

Expandir fragmento

— Guy Engel
fuente

3

Puede utilizar SyntheticEvent en lugar de MouseEvent

— Sras
fuente