當(dāng)子元素結(jié)構(gòu)單一的時(shí)候
<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>
當(dāng)子元素結(jié)構(gòu)結(jié)構(gòu)復(fù)雜時(shí)的時(shí)候菱皆,其實(shí)也沒什么大差別软瞎,只需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