Nhận dữ liệu đối tượng và phần tử mục tiêu từ sự kiện onClick trong phản ứng js

Question

Đây là mã của tôi. Tôi muốn lấy cả hai dữ liệu trong đối tượng mục tiêu & mục tiêu sử dụng sự kiện onClick. Có ai giúp tôi không.

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

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

Answer 1

Điều gì về việc sử dụng chức năng mũi tên trong trình xử lý 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

Trước tiên, nếu bạn ràng buộc null bạn sẽ không nhận được bất kỳ ngữ cảnh hay đối tượng UIEvent nào.

Bạn cần thay đổi onClick thành 'onClick = {this.handleClick} `.

Và chức năng xử lý của bạn sẽ trông như thế

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

Hãy thử biến thể mã này:

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

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