反应点击事件不冒泡

Question

我在反应事件冒泡时遇到问题。我在 span 元素和上部元素的某处有一对图标，如下例所示：

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 至少两次（第一次用于 i，第二次用于跨度）。但它永远不会发生。你能告诉我为什么吗？

我知道可能的解决方案 - 设置pointer-events为i，none但我更好奇为什么事件不冒泡。

谢谢

Answer 1

我看到了你在问题中提到的代码。首先，您没有添加 onClick 事件<i/>标签。首先在其中添加onClick，然后尝试添加span。截至目前，我看到您仅添加了 onClick 部分。