grid.wxml 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. <template name="grid">
  2. <block wx:if="{{gridThemeItems.length === 1}}">
  3. <t-grid align="center" t-class="{{classPrefix}}__grid" column="{{count / 2}}" class="{{classPrefix}}__single-wrap">
  4. <t-grid-item
  5. t-class="{{classPrefix}}__grid-item"
  6. class="{{classPrefix}}__square"
  7. wx:for="{{gridThemeItems[0]}}"
  8. wx:key="index"
  9. bind:tap="onSelect"
  10. data-index="{{index}}"
  11. icon="{{item.icon}}"
  12. text="{{item.label}}"
  13. image="{{item.image}}"
  14. >
  15. </t-grid-item>
  16. </t-grid>
  17. </block>
  18. <block wx:elif="{{gridThemeItems.length > 1}}">
  19. <view class="{{classPrefix}}__swiper-wrap">
  20. <swiper style="height: 456rpx" autoplay="{{false}}" current="{{currentSwiperIndex}}" bindchange="onSwiperChange">
  21. <swiper-item wx:for="{{gridThemeItems}}" wx:key="index">
  22. <t-grid align="center" t-class="{{classPrefix}}__grid {{classPrefix}}__grid--swiper" column="{{count / 2}}">
  23. <t-grid-item
  24. t-class="{{classPrefix}}__grid-item"
  25. class="{{classPrefix}}__square"
  26. wx:for="{{item}}"
  27. wx:key="index"
  28. data-index="{{index}}"
  29. bind:tap="onSelect"
  30. icon="{{item.icon}}"
  31. text="{{item.label}}"
  32. image="{{item.image}}"
  33. >
  34. </t-grid-item>
  35. </t-grid>
  36. </swiper-item>
  37. </swiper>
  38. <view class="{{classPrefix}}__nav">
  39. <view class="{{classPrefix}}__dots">
  40. <view
  41. wx:for="{{gridThemeItems.length}}"
  42. wx:key="index"
  43. class="{{classPrefix}}__dots-item {{index === currentSwiperIndex ? prefix + '-is-active' : ''}}"
  44. />
  45. </view>
  46. </view>
  47. </view>
  48. </block>
  49. </template>