事件委托

事件委托

基本概念：

• 把一个元素响应事件（click、keydown......）的函数委托到另一个元素
• 一般来讲，会把一个或者一组元素的事件委托到它的父层或者更外层元素上，真正绑定事件的是外层元素，当事件响应到需要绑定的元素上时，会通过事件冒泡机制从而触发它的外层元素的绑定事件上，然后在外层元素上去执行函数。

举个栗子：

image.png

就像 组件一般 子组件不能直接向 父组件的同级组件获取数据 所以事件委托 父组件 向其同级组件 获取数据 在传回给 委托源
（委托事件 => 实现是利用事件冒泡的机制)

事件冒泡？

• 事件冒泡是JS 事件流的一部分
  图示

  
  
  image.png

如上图所示，事件模型是指分为三个阶段：

• 事件捕获阶段：在事件冒泡的模型中，捕获阶段不会响应任何事件 => 从上往下寻找（外 -> 内) 直到找到事件目标；
• 事件目标阶段：目标阶段就是指事件响应到触发事件的最底层元素上；
• 事件冒泡阶段：冒泡阶段就是事件的触发响应会从最底层目标一层层地向外到最外层（根节点）=> 从下往上寻找(内->外) => 类似栈