微信小程序事件对象中e。target和e.currentTarget的区别详解 - 行业资讯

在小程序的事件回调触发时,会接收一个事件对象,事件对象的参数中包含一个目标和currentTarget属性,接下来说说这二者的区别。

首先上代码:

wxml部分:

　　　　　　& lt;视图id=皌ar-father bindtap”=暗慊鳌北? 　　父组件　　& lt;视图id=皌ar-children”祝辞子组件& lt;/view> 　　& lt;/view> 　　之前　　　　

wxs部分:

　　　　　　# tar-father { 　　宽度:300 rpx; 　　身高:300 rpx; 　　背景颜色:天蓝色; 　　} 　　# tar-children { 　　背景颜色:粉色; 　　} 　　　　之前　　　　

效果图
　　

微信小程序事件对象中e。target和e.currentTarget的区别详解

js部分:
　　

　　　　　　点击:函数(事件){ 　　console.log (event.target) 　　console.log (event.currentTarget) 　　} 　　　　

当点击图中粉色子组件区域时的输出结果:
　　

微信小程序事件对象中e。target和e.currentTarget的区别详解

事件。目标为其子组件,也就是触发该事件的源头组件
　　

事件。currentTarget为事件所绑定的组件

当点击图中蓝色父组件区域时的输出结果:
　　

微信小程序事件对象中e。target和e.currentTarget的区别详解

事件。目标为父组件,因为触发的源头也就是父组件本身

事件。currentTarget始终为事件所绑定的组件
　　

总结:目标对应的是触发事件的源头组件,这个组件有可能是子组件,有可能是父组件,主要是看执行动作的区域。而currentTarget始终对应事件所绑定的组件。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。