事件委托在vue上的实现

最近老板总嫌弃网站做的太卡，看一看项目里面的代码，真是头皮发麻。由于代码的问题占用了过多的dom内存，能不卡吗，所以，这其实还是一个程序员编码的问题。比如在vue里面，我发现大家总不爱用事件委托。

事件委托是为了较少dom操作的内存占用，优化性能提出的一种方法。它通过在父元素上绑定事件，依靠冒泡捕获子元素触发的事件，进而处理。

它有以下的特点：

1、基于事件冒泡。

2、动态添加的节点也将自动加入绑定到委托事件中。

3、可以在页面的任何一个生命周期添加事件处理程序，而不用等待其余事件例如onload、onContentload的完成。

最常见的例子一个ul中由多个li组成，每次任意点击一个li，使其变成红色。如果给每一个li都加上一个点击事件，那成千上万个li呢？这无疑会造成内存空间的巨大浪费：

const liSymbol=Symbol();
let domObj=Object.create();
donmObj.defineProperty(domObj,liSymbol,document.getElementByTagName("ul li"));
domobj[liSymbol].forEach((item,index)=>{
    item.onclick=function(){
        item.style.color="red";
    }
})

这种写法显然不适合采用。

利用事件委托可以解决这个问题：

const ulSymbol=Symbol();
let domObj=Object.create();
donmObj.defineProperty(d