实际开发中应尽量避免 React 合成事件与原生事件混用，两者的传播机制不一样。

React 17 起，合成事件的监听器统一挂在根容器（createRoot 的那个节点）上，React 16 及更早版本挂在 document 上，而不是挂在触发事件的那个 DOM 节点上。由此带来两个结论：

1. 合成事件的 e.stopPropagation() 能阻止合成事件继续冒泡，父组件的 React 处理器不会再触发；但它阻止不了原生监听器 —— 原生监听器挂在真正的 DOM 节点上，在事件冒泡到 React 根容器之前就已经执行完了。
2. 反过来，在原生监听器里调用原生事件对象的 e.stopPropagation()，可以阻止事件冒泡到 React 的根容器，从而让 React 的合成事件处理器完全不触发。

所以：想拦住 React 组件树上的冒泡，用合成事件的 stopPropagation()；想让某个 React 处理器根本不执行，就得在更内层的原生监听器里阻止原生冒泡。混用时很容易踩到「明明调了 stopPropagation 却还是触发了」或者「React 处理器莫名没执行」这类问题。