У меня есть часть компонента React, который выглядит следующим образом:

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

И обработчик кликов для элемента th:

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

Я хочу захватить элемент th. Он прекрасно работает, когда headerElement является «некоторой строкой», но когда это элемент input, элемент input является элементом, на который есть ссылка в свойстве event.target.

Как лучше всего этого добиться?

41
Daniel Calderon Mori 18 Дек 2015 в 08:38

4 ответа

Лучший ответ

Поскольку вы привязываете обработчик к th, вы можете использовать currentTarget собственность. Свойство target относится к элементу, отправившему событие.

_onHeaderClick(event) {
    event.preventDefault();
    console.log(event.currentTarget);
}
69
Arun P Johny 18 Дек 2015 в 05:41

Просто используйте event.currentTarget

 onClick(e) {
    e.preventDefault();
    console.log(e.currentTarget);
}
0
Sabir Hussain 2 Июл 2018 в 09:24

Как это?

event.target.parentNode
5
Bhojendra Rauniyar 18 Дек 2015 в 05:40

Проверь их

_onHeaderClick(event) {
   event.preventDefault();
   if(event.target === event.currentTarget) {
      // handle
   }
}
23
nghiepit 7 Ноя 2017 в 10:04