Notes

React Portals 上的事件是否会冒泡到父组件,原理是什么

结论:会(按 React 组件树语义);虽然 Portal 的 DOM 挂在树外,但事件分发是沿 Fiber/React 树收集 listeners,而不是沿 DOM 父子关系决定“React 冒泡路径”。

1. 为什么 DOM 在外也能冒泡到父组件

  • Portal 只改变“DOM 挂载点”,不改变组件在 React 树中的父子关系
  • React 在分发时以 Fiber 路径收集回调,因此能回到逻辑父组件

2. 你需要强调的区别

  • 原生 DOM 冒泡:按 DOM 树父子
  • React 冒泡:按 Fiber/组件树(再由根委托接住原生事件)

3. 面试追问

  • 多 root 情况:事件委托在各自 root,跨 root 的行为要结合具体挂载结构说明

关联阅读

cd ..