在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