<view class="list" wx:for="{{list}}" wx:key>
<view class="item">
<view class="wrap" style="transform:translateX({{item.x/2}}px);" data-index="{{index}}" bindtouchstart='touchstart' bindtouchmove='touchmove' bindtouchend='touchend'>{{item.item}}</view>
<view class="delete"><text>删除</text></view>
</view>
</view>
.item{ position:relative; }
.wrap{
position:absolute;z-index:2; top:0;left:0;
backgorund:#fff;width:100%;height:100%;
}
.delete{ position:absolute;z-index:1; top:0;right:0;width:120rpx;height:100%;}
data:{
index:"",
Mstart:"",
list:[{item:"123"},{item:"456"},{item:"789"}]
},
touchstart:function(e){
this.setData({
index: e.currentTarget.dataset.index,
Mstart: e.changedTouches[0].pageX
});
},
touchend: function (e) {
let list = this.data.list;
let move = this.data.Mstart - e.changedTouches[0].pageX;
list[this.data.index].x = move > 100 ? -180 : 0;
this.setData({
list: list
});
},
touchmove: function (e) {
let list = this.data.list;
let move = this.data.Mstart - e.changedTouches[0].pageX;
list[this.data.index].x = move > 0 ? -move : 0;
this.setData({
list: list
});
}