javascript - react 点击事件不冒泡

Question

我在 react 事件冒泡时遇到问题。我在 span 元素和上部元素的某处与图标配对，就像这样 example以下:

const App = () => {
  const onClick = (event) => alert(event.target.nodeName);
  return (
    <section onClick={onClick}>
      <span>
        <i className="fas fa-reply"></i> Click me
      </span>
    </section>
  );
};

点击后 i标记我正在等待事件气泡 - 至少调用 onClick 两次(第 1 次为 i，第 2 次为跨度)。但它永远不会发生。你能告诉我为什么吗？
我知道可能的解决方案 - 设置 pointer-events在 i至 none ，但我更好奇为什么事件不冒泡。
谢谢

Answer 1

我看到了你在问题中提到的代码。
首先，您没有将 onClick 事件添加到

<i/>

标签。首先在其中添加 onClick 然后尝试添加跨度。到目前为止，我看到您只为部分添加了 onClick。