Synthetic e
e
Fiber: rootContainer
return Synthetic e {
_dispatchInstances: [ ]
_dispatchListeners: [ ]
}
Fiber: div
events = extractEvent()
浏览器捕获,目标,冒泡
Fiber: button
Propagator: 模拟捕获冒泡,收集所有回调
onCaptureClick: f1()
click 事件
onClick: f2()
window
document
button
div
click事件处理完毕
React事件监听在documnet上,进入React事件系统
浏览器
向extractEvent()传入原生事件e,生成合成事件SyntheticEvent和需要触发的回调数组
按照返回的合成事件和事件触发队列forEach触发回调,
如有stopPropagation则break掉
传入propagator,模拟捕获冒泡,收集所有需要触发的回调
我们点击一个按钮,触发click事件
遍历Event Plugins,生成合成事件SyntheticEvent