如何獲取event.target以返回特定的target元素？

Question

在我的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>標記的圖標。 <i>如何確保整個按鈕作為event.target的一部分返回，而不僅僅是<i>

Answer 1

您可以使用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>