反応jsのonClickイベントからオブジェクトデータとターゲット要素を取得

Question

これは私のコードです。私はオブジェクト&の両方のデータをonClickイベントを使って取得します。 誰でも助けてくれますか？

handleClick = (data) => { 
    console.log(data); 
} 

<input type="checkbox" value={data.id} defaultChecked={false} onClick={this.handleClick.bind(null, data)}/> 

Answer 1

onClickハンドラの矢印機能の使用についてはどうですか？

handleClick = (e, data) => { 
    // access to e.target here 
    console.log(data); 
} 

<input type="checkbox" value={data.id} defaultChecked={false} onClick={((e) => this.handleClick(e, data))}/> 

Answer 2

まず、あなたがnullをバインドする場合は、任意のコンテキストもたUIEventオブジェクトを取得することはできません。

onClickを 'onClick = {this.handleClick}'に変更する必要があります。

そして、あなたのハンドル機能が

handleClick = (event) => { 
    const { target: { value } } = event; 

    // And do whatever you need with it's value, for example change state 
    this.setState({ someProperty: value }); 
}; 

Answer 3

のようになります。このコードのバリエーションを試してみてください：

handleClick = (data, e) => { 
    console.log(e.target.value, data); 
} 

<input type="checkbox" value={data.id} defaultChecked={false} onClick={this.handleClick.bind(this, data)}/>