React 组件中怎么做事件代理

React 并不会把所有的处理函数直接绑定在真实的dom节点上，而是把所有的事件绑定到结构的最外层（合成事件层），使用一个统一的事件监听器，这个事件监听器上维持了一个映射来保存所有组件内部的事件监听和处理函数。
当组件挂载或卸载时，只是在这个统一的事件监听器上插入或删除一些对象。

当事件发生时，首先被这个统一的事件监听器处理，然后在映射里找到真正的事件处理函数并调用。
这样做的优点是解决了兼容性问题，并且简化了事件处理和回收机制（不需要手动的解绑事件，React 已经在内部处理了）。但是有些事件 React 并没有实现，比如 window 的 resize 事件。

在 React 底层，主要对合成事件做了两件事：
1）事件委派：React 会把所有的事件绑定到结构的最外层，使用统一的
事件监听器，这个事件监听器上维持了一个映射来保存所有组件内部
事件监听和处理函数。
2）自动绑定：React 组件中，每个方法的上下文都会指向该组件的实例，
即自动绑定 this 为当前组件。

在React17版本中：
所有事件都是委托在id = root的DOM元素中，之所以会将事件委托从document中移到id = root的DOM元素，
是为了可以更加安全地进行新旧版本 React 树的嵌套。