多规格商品SKU 组件封装

前言

做电商项目呢，离不开多规格商品，SKU 也是弄了许久才搞出来，主要是多层级的联动关系，用ID和库存来判断是否是按钮禁止状态

下面就放下代码：

以封装的小程序为例：

多规格商品SKU 组件封装

WXML：

<view class="sku-box" wx:if="{{cpSkuTree.length}}">
  <view class="sku-row" wx:for="{{cpSkuTree}}" wx:key="{{index}}">
    <view class="sku-title">{{item.k}}</view>
    <view class="sku-wrap flex-row">
      <view class="sku-item {{iitem.disabled ? 'disabled': ''}} {{iitem.selected ? 'selected': ''}}" wx:for="{{item.v}}" wx:for-item="iitem" wx:for-index="iindex" wx:key="{{iindex}}" data-index="{{index}}" data-iindex="{{iindex}}" data-k="{{item}}" data-value="{{iitem}}" catchtap="selectSku">{{iitem.name}}</view>
    </view>
  </view>
</view>

View Code