如圖

遍歷列表的過程中需要綁定數(shù)據(jù)，點擊時候需要綁定數(shù)據(jù)

這里是源代碼

 <block wx:for="{{productList}}" wx:key="productId">
      <view class="product-item" bindtap="handleProductClick" data-product-id="{{item.productId}}">
        <image class="product-image" src="{{item.imageUrl}}" mode="aspectFill"></image>
        <view class="product-info">
          <view class="product-title">{{item.title}}</view>
          <view class="product-price">價格：{{item.price}}元</view>
          <view class="product-id">商品ID：{{item.productId}}</view>
          <view class="seller-id">發(fā)布者ID：{{item.sellerId}}</view>
        </view>
        <view class="product-edit">
          <button wx:if="{{item.status === 1}}" class="shangjia-button" data-status="0" data-product-id="{{item.productId}}" catchtap="onShelf">可上架</button>
          <button wx:if="{{item.status === 0}}" class="xiajia-button" data-status="1" data-product-id="{{item.productId}}" catchtap="offShelf">待下架</button>
        </view>
      </view>
    </block>

這里有幾個點注意：

1、代碼別寫到最外層的view上了，傳不到這個button上
data-product-id=“{{item.productId}}” XXXXX
2、如何點擊按鈕獲取當前的 商品id和上下架狀態(tài)呢？
catchtap=“onShelf” 或者 bindtap=“onShelf”

data-product-id=“{{item.productId}}
注意這塊不要攜程data-productId=”{{}}"

后臺獲取方式 productId要大寫，小程序會轉(zhuǎn)化

  onShelf(event){
   var status = event.currentTarget.dataset.status;
   var productId = event.currentTarget.dataset.productId;
   console.log("on shef" , status)
   console.log("data productId" , productId）
  },

微信小程序中，bindtap和catchtap這兩個事件處理器的主要區(qū)別在于他們處理事件冒泡的方式不同。
bindtap：當你在元素A上觸發(fā)了事件，這個事件會一級一級向上（從子元素向父元素）冒泡，也就是說，如果元素A的父元素B和父父元素C等也對這個事件有響應處理，那么他們的處理函數(shù)也會被觸發(fā)。
catchtap：catchtap是一種在當前元素上阻止事件向上冒泡的處理方式。如果你在元素A上觸發(fā)了catchtap事件，那么這個事件將只會在元素A上被處理，并阻止這個事件繼續(xù)向上冒泡。這顯然在你不希望或者不需要父級元素響應同一事件的時候非常有用。
給個例子，如果你在一個button上用了bindtap，然后這個button又在一個view元素內(nèi)部，這個view元素也有一個bindtap事件，那么如果你點擊了這個button，兩個bindtap事件都會被觸發(fā)。如果你不希望點擊button也會觸發(fā)view上的事件，你就可以使用catchtap替代button上的bindtap。文章來源地址http://www.zghlxwxcb.cn/news/detail-831865.html

到了這里，關(guān)于微信小程序-綁定數(shù)據(jù)并在后臺獲取它的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！