<!-- wxml商品标题和商品标签区域代码 -->
<view class="vbig"><!-- 总区域 -->
 
  <view class="list" wx:for="{{list}}" wx:key="_id"><!-- 循环渲染每个商品组合 -->
 
    <image src='{{item.img1}}' mode="aspectFill" class="img1-img"></image><!-- 商品图片 -->
  
    <view class="titlegroup"><!-- 颜色标签和商品标题区域 -->
      <view class="tradeway" wx:if="{{item.tradeway}}">{{item.tradeway}}</view><!-- 送货上门标签 -->
      <view class="{{item.stubudidx==1? 'girlbud':item.stubudidx==2? 'girlbud':item.stubudidx==3? 'boybud':item.stubudidx==4? 'boybud':item.stubudidx==5? 'girlbud':item.stubudidx==6? 'girlbud':item.stubudidx==7? 'girlboybud':'boyboybud'}}">{{item.stubud}}</view>
      <!-- 控制楼号标签的不同样式 -->
      <view class="title">{{item.title}}</view><!-- 商品标题 -->
    </view>
/* wxss代码 */
 .vbig{
  width: 690rpx;
  margin: 30rpx;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}/* 总区域 */
.list{
width: 335rpx;
margin-bottom: 40rpx;
}/* 循环渲染每个商品组合 */
.tradeway{
  background-color: #FFD700;
  width: 90rpx;
  height: 32rpx;
  border-radius: 8rpx;
  font-size: 20rpx;
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
  color:white;
}/* 送货上门标签 */
.title{
  font-size: 28rpx;
  font-weight: bold;
}/* 商品标题 */