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)}}>
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>;
}
})
Du kannst das
class Mycomponent extends React.component {
submit(e) {
//handle event
}
render() {
return <button className={s.button} onClick={this.submit.bind(this)} />
}
}