如何获取event.target以返回特定的target元素?

时间:2018-08-22 17:26:33

标签: javascript reactjs

在我的react应用程序中,我有一个按钮,其作用类似于状态切换器,此按钮具有id属性/ prop,并且此按钮包装了超棒的字体图标。

<button id={feedId}>
   <i className={isStatus === 'Y' ? 'fa fa-unlock' : 'fa fa-lock'} /> 
   {isStatus === 'Y' ? 'Active' : 'Inactive'}
</button>

现在,根据您单击按钮的位置,event.target将返回带有id的整个按钮或仅返回带有<i>标签的图标,我如何确保整个按钮作为事件的一部分返回.target而不只是<i>

1 个答案:

答案 0 :(得分:2)

您可以使用currentTarget

function test(e) {
  console.log('Target ', e.target);
  console.log('Current Target ', e.currentTarget)
}
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
<button id="test" onclick="test(event)">
       <i class="fa fa-quora" aria-hidden="true"></i>
       Text
    </button>