微信小程序完成左滑删除效果代码展示

disX < 0){//如果移动距离小于等于0，文本层位置不变 txtStyle = "left:0px"; }else if(disX > 0 ){//移动距离大于0，文本层left值等于手指移动距离 txtStyle = "left:-"+disX+"px"; if(disX>=delBtnWidth){ //控制手指移动距离最大值为删除按钮的宽度 txtStyle = "left:-"+delBtnWidth+"px"; } } //获取手指触摸的是哪一个item var index = e.currentTarget.dataset.index; var list = that.data.addressList; //将拼接好的样式设置到当前item中 list[index].txtStyle = txtStyle; //更新列表的状态 this.setData({ addressList:list }); } }, touchE:function(e){ console.log("touchE"+e); var that = this if(e.changedTouches.length==1){ //手指移动结束后触摸点位置的X坐标 var endX = e.changedTouches[0].clientX; //触摸开始与结束，手指移动的距离 var disX = that.data.startX - endX; var delBtnWidth = that.data.delBtnWidth; //如果距离小于删除按钮的1/2，不显示删除按钮 var txtStyle = disX > delBtnWidth/2 ? "left:-"+delBtnWidth+"px":"left:0px"; //获取手指触摸的是哪一项 var index = e.currentTarget.dataset.index; var list = that.data.addressList; list[index].txtStyle = txtStyle; //更新列表的状态 that.setData({ addressList:list }); } }