swipe-action.wxml 1.6 KB

1234567891011121314151617181920212223242526272829
  1. <view class="tui-swipeout-wrap">
  2. <view class="tui-swipeout-item {{isShowBtn?'swipe-action-show':''}}" bindtouchstart="handlerTouchstart" bindtouchmove="handlerTouchmove" bindtouchend="handlerTouchend" style="{{parse.setPosition(position)}}">
  3. <view class="tui-swipeout-content">
  4. <slot name="content"></slot>
  5. </view>
  6. <view class="tui-swipeout-button-right-group" wx:if="{{actions.length > 0}}" catchtouchend="loop">
  7. <view class="tui-swipeout-button-right-item" wx:for="{{actions}}" style="{{parse.setStyle(item)}};width:{{item.width}}px;" wx:key="{{index}}" data-index="{{index}}" bindtap="handlerButton">
  8. <image src="{{item.icon}}" wx:if="{{item.icon}}" style="width:{{item.imgWidth}}rpx;height:{{item.imgHeight}}rpx"></image>
  9. <text>{{item.name}}</text>
  10. </view>
  11. </view>
  12. <!--actions长度设置为0,可直接传按钮进来-->
  13. <view class="tui-swipeout-button-right-group" catchtouchend="loop" bind:tap="handlerParentButton" wx:if="{{actions.length === 0}}" style="width:{{operateWidth}}px;right:-{{operateWidth}}px;">
  14. <slot name="button"></slot>
  15. </view>
  16. </view>
  17. <view wx:if="{{isShowBtn && position.pageX != 0}}" class="swipe-action_mask" bindtap="closeButtonGroup" catchtouchmove="closeButtonGroup" />
  18. </view>
  19. <wxs module="parse">
  20. module.exports = {
  21. setStyle: function(item) {
  22. var defaults = '#f7f7f7';
  23. return 'background:' + (item.background ? item.background : defaults) + ';' + 'color:' + item.color;
  24. },
  25. setPosition: function(position) {
  26. return 'transform:translate(' + position.pageX + 'px,0);';
  27. }
  28. }
  29. </wxs>