Por que `MouseEvent` no manipulador de eventos da caixa de seleção não é genérico?

97

Eu tenho uma caixa de seleção do elemento TSX (JSX):

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

Com a ajuda do código VS, sei que o tipo de parâmetro de entrada do this.handleCheckboxClické MouseEvent<HTMLInputElement>. Então, eu implementei com:

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

Então recebo um erro dizendo [ts] Type 'MouseEvent' is not generic.como mostrado na imagem abaixo:

Versão dos meus pacotes:

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

Por que é que?

— Ben
fonte

264

Você provavelmente está usando o DOM MouseEvent. Tente usar em seu React.MouseEvent<HTMLInputElement>lugar.

— Rossipedia
fonte

2

Não trabalhando para mim, eu recebo:

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

— Kokodoko

@Kokodoko, você já consertou isso?

— SuperUberDuper

9

Para usar o React MouseEvent, certifique-se de adicionar:

import { MouseEvent } from 'react';

Expandir snippet

— Guy Engel
fonte

3

Você pode usar SyntheticEvent em vez de MouseEvent

— Sras
fonte