在vue中实现事件委托

最新推荐文章于 2024-08-01 13:31:18 发布

沈胖三

最新推荐文章于 2024-08-01 13:31:18 发布

阅读量9.3k

点赞数 2

分类专栏：笔记自用文章标签： vue 事件委托

本文链接：https://blog.csdn.net/she8362315/article/details/82798248

版权

笔记同时被 2 个专栏收录

48 篇文章 2 订阅

订阅专栏

自用

36 篇文章 0 订阅

订阅专栏

在父元素上绑定点击事件

<div class="panel" @click="rowClick1($event)">
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <a href="#"></a>
</div>

使用e.target可以获得点击时获取的所有属性与值,我们可以通过e.target.localName获取点击的标签名,来进行对比判断,相同则触发绑定事件

<script>
      rowClick1(e){
        console.log(e.target);        
        if(e.target.localName === 'li'){
           console.log("触发事件1");            
        }else if(e.target.localName === 'a'){
	  console.log("触发事件2");   
	}
    
      },
</script>