React onClick - Evénement passé avec paramètre

Question

sans paramètre

function clickMe(e){
  //e is the event
}

<button onClick={this.clickMe}></button>

avec paramètre

function clickMe(parameter){
  //how to get the "e" ?
}
<button onClick={() => this.clickMe(someparameter)}></button>

Je veux obtenir le event. Comment puis-je l'avoir?

Answer 1

Essaye ça

<button onClick={(e) => {
     this.clickMe(e, someParameter)
}}>Click Me!</button>

Et dans votre fonction

function clickMe(event, someParameter){
     //do with event
}

Answer 2

Solution 1

function clickMe(parameter, event){
}

<button onClick={(event) => {this.clickMe(someparameter, event)}></button>

Solution 2 L'utilisation de la fonction bind est considérée comme meilleure que la façon dont la fonction de flèche est utilisée dans la solution 1. Notez que le paramètre event doit être le dernier paramètre de la fonction handler.

function clickMe(parameter, event){
}

<button onClick={this.clickMe.bind(this, someParameter)}></button>

Answer 3

Avec l'ES6, vous pouvez faire de manière plus courte comme ceci:

const clickMe = (parameter) => (event) => {
    // Do something
}

Ans l'utilise:

<button onClick={clickMe(someParameter)} />