web-dev-qa-db-fra.com

comment ajouter deux fonctions onClick dans React

hé ~ J'essaie d'activer une fonction de soumission et un événement de clic Google sur le même onClick dans React Comment est-ce que je fais ceci dans React?

C'est le code: 

<button className={s.button} onClick={this.submit} onClick={ () => {gaClickEvent('where-to-buy', 'submit' , undefined)}}>
5
bluegen1e

Il y a deux façons de le faire.

Pour commencer, vous pouvez insérer deux instructions dans le gestionnaire de clics que vous définissez en ligne avec la syntaxe littérale de la fonction ES6.

<button 
  className={s.button}
  onClick={ (e) => {
    gaClickEvent('home-where-to-buy', 'submit' , undefined);
    this.submit(e);
  }} >

Mais c'est un peu plus de code que je serais à l'aise de mettre dans un gestionnaire onClick. Si j'étais vous, je séparerais cette logique en une méthode de gestion du composant. Par exemple:

var MyComponent = React.createClass({
  handleClick () {
    gaClickEvent('home-where-to-buy', 'submit' , undefined);
    this.submit();
  },
  render () {
    return <button 
      className={s.button}
      onClick={(e) => this.handleClick(e)} >
      I am a button!
      </button>;
  }
})
7
Buck Shlegeris

Tu peux le faire 

class Mycomponent extends React.component {
 submit(e) {
  //handle event
 }
 render() {
  return <button className={s.button} onClick={this.submit.bind(this)} />
 }
}
0
Pranesh Ravi