J'ai une partie d'un composant de réaction comme ceci:
var headerElement = someBoolean ? <input/> : 'some string';
return <th onClick={this._onHeaderClick}>{headerElement}</th>;
Et un gestionnaire de clic pour l'élément th:
_onHeaderClick(event) {
event.preventDefault();
console.log(event.target);
},
Je veux capturer le troisième élément. Cela fonctionne bien lorsque headerElement est 'une chaîne', mais lorsqu'il s'agit d'un élément input, l'élément input est celui référencé dans le champ event.target. Quel est le meilleur moyen d'y parvenir?
Puisque vous liez le gestionnaire à th
, vous pouvez utiliser la propriété currentTarget . La propriété target fait référence à l'élément qui a envoyé l'événement.
_onHeaderClick(event) {
event.preventDefault();
console.log(event.currentTarget);
}
Les vérifier
_onHeaderClick(event) {
event.preventDefault();
if(event.target === event.currentTarget) {
// handle
}
}
Comme ça?
event.target.parentNode
utilisez simplement event.currentTarget
onClick(e) {
e.preventDefault();
console.log(e.currentTarget);
}