Custom attribute acquisition of view in applet

When you click on a component during applet development, you need to get some properties of the currently clicked image , Such as the current location or picture link , At this point, you can get the through the custom attribute .

1. Definition

Identification of custom attributes data-attrName , Behind them “attrName” Name it casually , Prefix “data-” Is a must .

2. Use

stay wxml The following code is added to the file ：

 <image class="image-style" data-src='{
   {imgSrc}}' src="{
   {imgSrc}}"  bindtap="previewImage"></image>

Then the preview interface can be shown as follows ：

  //  The preview image 
  previewImage: function(e) {
    var current = e.target.dataset.src;
    wx.previewImage({
      current: current, //  The http link   
      urls: this.data.imgList //  Pictures that need to be previewed http Link list   
    })   
  },

3. e.target And e.currentTarget

e.target Take the properties of the clicked object ;
If it is data- Put it on the outer layer , You can't get the attribute value by clicking on the element inside ;
While using e.currentTarget Is to take bintap/catchtap Property of the object in which the ~, Click on the element inside to get the attribute value .

<view class='a-child' data-tid='{
   {child.ID}}' bindtap='selectChild'>
  <image class='avatar' src='../../images/localImages/default_user.png'></image>
  <view class='child-mid'>
    <view class='mid-top child-name'>{
   {child.STUDENTNAME}}</view>
  </view>
</view>

Example Need to take tid To be as follows ：

 selectChild: function(e) {
    // obtain ID
    var tid = e.currentTarget.dataset.tid
    console.log('tid: ' + tid)
  },