uniapp点击当前元素如何判断元素信息

方法一:(用定义id的方式)

// html部分
<view class="store-dialog" @click="clickStoreDialogMark" id="storeDialog">
   <view class="store-info" id="storeInfo">
       商城信息
   </view>
</view>

//javascript部分
clickStoreDialogMark(e) {
console.log(document.getElementById(e.target.id))
  if (e.target.id === 'storeDialog') { // 点击的是外面的大盒子
    console.log(e.target)
  } else if (e.target.id === 'storeInfo') { // 点击的是商城信息的区域
    console.log(e.target)
  }
}


方法二:(用data属性的方式)

// html部分
<view class="store-dialog" @click="clickStoreDialogMark" data-class="store-dialog">
   <view class="store-info" data-class="store-info">
       商城信息
   </view>
</view>

//javascript部分
clickStoreDialogMark(e) {
console.log(document.getElementsByClassName(e.target.dataset.class)[0])
  if (e.target.dataset.class === 'store-dialog') { // 点击的是外面的大盒子
    console.log(e.target)
  } else if (e.target.dataset.class === 'store-info') { // 点击的是商城信息的区域
    console.log(e.target)
  }
}

注意:根据业务逻辑修改

posted @ 2021-09-24 11:14  李健威  阅读(2465)  评论(0)    收藏  举报