wake-up-neo.com

wie man zwei onClick-Funktionen in React hinzufügt

hey ~ Ich versuche, eine Submit-Funktion und ein Google Click-Ereignis für dasselbe onClick in React auszulösen. Wie mache ich das in React?

Dies ist der Code: 

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

Dafür gibt es zwei Möglichkeiten.

Zu Beginn können Sie zwei Anweisungen in den Click-Handler einfügen, den Sie mit der Literal-Syntax der ES6-Funktion definieren.

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

Dies ist jedoch etwas mehr Code, als ich in einen onClick-Handler einbauen könnte. Wenn ich Sie wäre, würde ich diese Logik in eine Handlermethode für die Komponente aufteilen. Z.B:

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

Du kannst das 

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