在react js中，點擊按鈕內部的圖示時，無法獲得按鈕值

Question

所以我試著從按鈕中取得值。這是我的button:

<button
  className="toggle__btn"
  value={el._id}
  onClick={toggle}
>
     <i className="fa-solid fa-circle-info fs-4"></i>
</button>

函數如下

const toggle = (event) => {
    const id = event.target.value;
    console.log(id);
  };

問題是我不能得到的值，如果我點擊圖標，但我可以當我點擊圖標外，但仍在按鈕內(有圖標外的空白空間)。我希望它返回id，即使當圖標被點擊。怎麼做呢?為什麼會發生這種情況?

Answer 1

試試

const toggle = (event) => {
    const id = event.currentTarget.value;
    console.log(id);
};

看看這個 https://medium.com/@etherealm/currenttarget-vs-target-in-js-2f3fd3a543e5