web-dev-qa-db-fra.com

Comment puis-je savoir que je peux utiliser onClick for button?

La liste des propriétés du document n'inclut pas onClick ( http://www.material-ui.com/#/components/icon-button )

Comment savoir si j'ai besoin d'utiliser onClick pour le gestionnaire de clics?

reactjsmaterial-ui
42
eugene

La documentation de Material-UI ne répertorie pas les événements standard React (navigateur natif):

https://facebook.github.io/react/docs/events.html#mouse-events

Cela est dû au fait que vous êtes déjà au courant des événements natifs disponibles. Par exemple, vous pouvez également utiliser onWheel. La liste serait longue et redondante si tous les événements natifs étaient inclus.

Comme kouak explique , d'autres accessoires (tels que onClick) sont transmis à un composant enfant approprié.

Exemple aléatoire:

<Button color="primary" onClick={() => { console.log('onClick'); }}>
    Primary
</Button>
50
thirtydot

Vous pouvez ajouter un wrapper sur le <IconButton/> pour obtenir l'événement onClick.

Exemple

render() {
  return <div class="font-icon-wrapper" onClick={this.fontIconClick}>
    <IconButton iconClassName="muidocs-icon-custom-github" />
  </div>
}

Cela devrait certainement fonctionner ...

4
Pranesh Ravi

Ajoutez simplement onClick aux accessoires que vous transmettez dans <IconButton />.

Les accessoires qui ne sont pas cités dans la doc sont passés dans leur composant interne <EnhancedButton /> Qui gérera bien onClick.

Voir ici: https://github.com/callemall/material-ui/blob/master/src/IconButton/IconButton.js#L241

3
kouak