web-dev-qa-db-ja.com

React onClick-パラメーター付きイベントを渡す

パラメータなし

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

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

パラメーター付き

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

eventを取得したい。どうすれば入手できますか？

javascriptreactjseventsdom-events
48
IMOBAMA

これを試して

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

そしてあなたの機能で

function clickMe(event, someParameter){
     //do with event
}
93
Jyothi Babu Araja

ソリューション1

function clickMe(parameter, event){
}

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

ソリューション2ソリューション1では、バインド関数を使用する方が矢印関数よりも優れていると見なされます。イベントパラメーターはハンドラー関数の最後のパラメーターである必要があります。

function clickMe(parameter, event){
}

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

ES6では、次のような短い方法で行うことができます。

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

ANSはそれを使用します：

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