1

I can't seem to figure how to solve this problem that if you click a react-bootstrap button with a fontawesome icon as a child, the onclick target value will be undefined.

But if you click just outside the text with the icon and still inside the button, the onclick handler will still work.

https://jsfiddle.net/utmcykcg/5/

alisongaleon
  • 153
  • 2
  • 4
  • 13

1 Answers1

7

The issue seems to be that event.target can change depending on where in the button you click. Using event.currentTarget instead should give you the results you're looking for.

onClick(e) {
  const btnValue = e.currentTarget.value
  alert(btnValue);
}

See also: What is the exact difference between currentTarget property and target property in javascript

Community
  • 1
  • 1
Chris
  • 17,119
  • 5
  • 57
  • 60