小程序中target与currentTarget的取值问题

　　今天看到同事遇到了小程序swiper组件点击无法滑动切换的问题，最终发现是冒泡的问题，和swiper没关系

原先正常的代码

<view class="swiper-tab-item {{currentTab==0?'active':''}}" data-current="0" bindtap="clickTab">用人</view>

由于要改样式和字体需要往里面加标签

<view class="swiper-tab-item {{currentTab==0?'active':''}}" data-current="0" bindtap="clickTab">
　　<image src="/xcx/xcx-nav01.png" class="xcx-img01"></image>
　　<image src="/xcx/xcx-nav01-on.png" class="xcx-img02"></image>
　　<view>用人</view>
</view>

发现clickTab点击事件虽然能进去，但是e.target.dataset.current取值是undefined

  clickTab: function (e) {
    console.log('e.target.dataset.current:',e.target.dataset.current)//undefined
    var that = this;

    if (this.data.currentTab === e.target.dataset.current) {
      return false;
    } else {
      that.setData({
        currentTab: e.target.dataset.current
      })
    }
  },

猜测是冒泡的原因，查询相关资料发现是和target的触发机制有关

target在事件流的目标阶段；currentTarget在事件流的捕获，目标及冒泡阶段。但事件流处于目标阶段，target与currentTarget指向一样， 而当处于捕获和冒泡阶段的时候，target指向被单击的对象而currentTarget指向当前事件活动的对象。在微信小程序中也可总结为：target指向发生事件的组件，currentTarget指向绑定事件的组件。

解决方案

把取值方式 由e.target.dataset.current 修改为e.currentTarget.dataset.current 即可，所以以后建议尽量写成currentTarget的方式可以少踩坑。