この記事では、React のクリックイベントで引数を渡す方法を紹介します。

問題の説明

まず問題の説明を見てみましょう。下図のとおりです：

では、この問題をどう解決すればよいのでしょうか？

以下は HTML コードです。clickFunctionこれはクリックイベント関数です。thisStatus渡す必要があるパラメータです：

<div onClick={this.clickFunction.bind(this, thisStatus)>收</div>

以下は React コードで関数がパラメータを受け取る方法です。thisStatus関数が受け取るパラメータ：

clickFunction(thisStatus, event) {
    console.log('thisStatus', thisStatus);
}

冒頭で挙げた問題を解決するには、同じく画像を見てください。

これでOKです。

まとめ

bind メソッドを使ってパラメータをバインドする必要があります。最初のパラメータは this を指し、2番目のパラメータ以降がイベント関数で受け取るパラメータになります。

<button onClick={this.handleClick.bind(this, props0, props1, ...}></button>
 
handleClick(porps0, props1, ..., event) {
    // your code here
}
  • イベント：this.handleclick.bind(this，渡すパラメータ)
  • 関数：handleclick(渡されたパラメータ, event)

原文アドレス：https://blog.csdn.net/genius_yym/article/details/54135567