Phản ứng - làm thế nào để nắm bắt con chỉ sự kiện onClick của cha mẹ và không

Question

tôi có một phần của một thành phần phản ứng như thế này:

var headerElement = someBoolean ? <input/> : 'some string'; 
return <th onClick={this._onHeaderClick}>{headerElement}</th>; 

Và một handler nhấp chuột cho nguyên tố thứ:

_onHeaderClick(event) { 
    event.preventDefault(); 
    console.log(event.target); 
}, 

Tôi muốn để nắm bắt yếu tố thứ. Nó hoạt động tốt khi headerElement là 'một số chuỗi', nhưng khi nó là một phần tử đầu vào, phần tử đầu vào là phần tử được tham chiếu trong trường event.target. Cách tốt nhất để đạt được điều này là gì?

Answer 1

Vì bạn đang ràng buộc trình xử lý là th bạn có thể sử dụng thuộc tính currentTarget. Thuộc tính target đề cập đến phần tử đã gửi sự kiện.

_onHeaderClick(event) { 
    event.preventDefault(); 
    console.log(event.currentTarget); 
} 

Answer 2

Như thế này?

event.target.parentNode 

Answer 3

Kiểm tra xem chúng

_onHeaderClick(event) { 
    event.preventDefault(); 
    if(event.target === event.currentTarget) { 
     // handle 
    } 
}