在微信小程序中 最常用的<view>控件 可以用bindtap（冒泡反應） 如<view bindtap="ItemOnclick" data-mType="123">的形式綁定ItemOnclick事件并傳遞一個dataset，其包含一個名為mType的元素 值為123。

在某一次設計中

有如下結構：

  <view class="func-m" bindtap="ItemOnclick" data-mType="123">    <image src="{{ROOT_PATH}}/images/icon1.png" />  </view>

ItemOnclick事件在點擊在圖片上時不會觸發 需要點擊在圖片之外及外層view范圍之內的地方 才會觸發

若將bindtap寫在<image>標簽內 則反過來 點擊圖片會觸發 但點擊在圖片之外及外層view范圍之內的地方不會觸發

由此我做出判斷

點擊事件不會向父級或子級控件傳遞。

（然而這與冒泡反應的定義是不一致的）

但是最近又碰到下面這種情況：

<view style="background-color:#eee;" bindtap="HideMenuList"><!--此為最外層view-->  <image src="{{ROOT_PATH}}/images/icon1.png" bindtap="ShowMenuList" />  <view class="menu-list">     <view class="menu-item" data-mType="CP" bindtap="MenuItemOnclick">     </view>     <view class="menu-item" data-mType="HW" bindtap="MenuItemOnclick">     </view>   </view></view>

需要實現 點擊圖片 顯示菜單列表 點擊每個菜單項 觸發MenuItemOnclick事件并傳遞對應的參數

然后當在<view class="menu-list">標簽外的地方點擊一下 就觸發HideMenuList事件隱藏菜單

而實際產生的效果是 當點擊圖片時 菜單列表一閃便消失 有時直接沒顯示
后通過打印log發現是當點擊圖片觸發了ShowMenuList事件后 HideMenuList事件也被觸發了（且總在ShowMenuList事件之后）

即點擊事件由<image>傳遞到了外層的<view> 因而觸發了HideMenuList事件

這樣的話那之前的判斷就是錯誤的

目前還沒找到這兩種情況之間的關鍵差異,第二種情況的解決方案是 當顯示菜單時 同時創造一個透明遮罩層覆蓋除菜單列表外的區域，點擊到這個透明遮罩層后觸發HideMenuList事件并銷毀或隱藏遮罩層

PS:第二種情況的方式 以前在html及Android環境下都有用過 是沒有這個問題的，可能微信小程序這方面的底層機制和html及Android不一樣，還待深究。

微信小程序bindtap與catchtap的區別詳解

參考官方文檔 https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxml/event.html

bindtap和catchtap都是當用戶點擊該組件的時候會在該頁面對應的Page中找到相應的事件處理函數。

bind事件綁定不會阻止冒泡事件向上冒泡，catch事件綁定可以阻止冒泡事件向上冒泡：

//視圖層<view id="outer" bindtap="handleTap1">   //在組件中綁定bindtap事件 函數handleTap1 outer view <view id="middle" catchtap="handleTap2"> //在組件中綁定catchtap事件 函數handleTap2  middle view  <view id="inner" bindtap="handleTap3"> //在組件中綁定bindtap事件 函數handleTap3   inner view  </view> </view></view>