CODEWITHSUNDEEP
javascriptreactjs
Hiero
Hiero

Reputation: 2205

React, click on the parent element

I have a thing in React like this

<li id="my-id" onClick={this.handleClick}>
  <span>Something here</span>
  <i>Some italic text here</i>
</li>

Where I need to access the id of my LI.

handleClick(ev) {
  console.log(ev.target);
}

The thing is that when I click on the italic text, it console me the i element, not the li as it should.

Can someone explain me why, and how can I make onClick to return my li element?

Upvotes: 1

Views: 2661

Answers (1)

Oleksandr T.
Oleksandr T.

Reputation: 77502

You need use .currentTarget instead of .target

handleClick(ev) {
  console.log(ev.currentTarget);
}

.currentTarget refers to the element where event handler has been attached to as opposed to .target which identifies the element on which the event occurred.

Upvotes: 10

Related Questions