当子元素结构单一的时候
<ul @click="handelEventDelegation">
<li data-sign="list1">list-1</li>
<li data-sign="list2">list-2</li>
<li data-sign="list3">list-3</li>
</ul>
<script>
handelEventDelegation(e) {
let sign = e.target.getAttribute('data-sign');
switch (sign) {
case 'list1':
//fuck
break;
}
}
</script>
当子元素结构结构复杂时的时候，其实也没什么大差别，只需js部分稍作修改即可
<li data-sign="list1">
list-1
<span>(11)</span>
</li>
let sign = e.target.getAttribute('data-sign');//before
let sign = e.target.parentNode.getAttribute('data-sign') || e.target.getAttribute('data-sign');//after
