小程序中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的方式可以少踩坑。