index.wxml 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738
  1. <view class="custom-class van-tabs van-tabs--{{ type }}">
  2. <view style="z-index: {{ zIndex }}; {{ wrapStyle }}" class="van-tabs__wrap {{ scrollable ? 'van-tabs__wrap--scrollable' : '' }} {{ type === 'line' && border ? 'van-hairline--top-bottom' : '' }}">
  3. <scroll-view
  4. scroll-x="{{ scrollable }}"
  5. scroll-with-animation
  6. scroll-left="{{ scrollLeft }}"
  7. class="van-tabs__scroll--{{ type }}"
  8. style="{{ color ? 'border-color: ' + color : '' }}"
  9. >
  10. <view class="van-tabs__nav van-tabs__nav--{{ type }}">
  11. <view wx:if="{{ type === 'line' }}" class="van-tabs__line" style="{{ lineStyle }}" />
  12. <view
  13. wx:for="{{ tabs }}"
  14. wx:key="index"
  15. data-index="{{ index }}"
  16. class="van-ellipsis van-tab {{ index === active ? 'van-tab--active' : '' }} {{ item.disabled ? 'van-tab--disabled' : '' }}"
  17. style="{{ color && index !== active && type === 'card' && !item.disabled ? 'color: ' + color : '' }} {{ color && index === active && type === 'card' ? ';background-color:' + color : '' }} {{ color ? ';border-color: ' + color : '' }} {{ scrollable ? ';flex-basis:' + (88 / swipeThreshold) + '%' : '' }}"
  18. bind:tap="onTap"
  19. >
  20. <view class="van-ellipsis van-tab__title">
  21. {{ item.title }}
  22. </view>
  23. </view>
  24. </view>
  25. </scroll-view>
  26. </view>
  27. <view
  28. class="van-tabs__content"
  29. bind:touchstart="onTouchStart"
  30. bind:touchmove="onTouchMove"
  31. bind:touchend="onTouchEnd"
  32. bind:touchcancel="onTouchEnd"
  33. >
  34. <view class="van-tabs__track" style="{{ trackStyle }}">
  35. <slot />
  36. </view>
  37. </view>
  38. </view>