小程序滑动删除功能怎么实现

本篇内容主要讲解“小程序滑动删除功能怎么实现”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“小程序滑动删除功能怎么实现”吧!小程序滑动删除效果示例
　　每个列表项绑定touchstart和touchmove事件，监听滑动手势，确定滑动角度，判断滑动是否有效列表数据源每一项包含标志值isTouchMove，用来确定此项是否滑动成功列表项有两个类，根据isTouchMove的值来确定渲染那个类删除时直接操作数据源
免费云主机域名
　　touchmove: function (e) {
　　let index = e.currentTarget.dataset.index,//当前索引
　　startX = this.data.startX,//开始X坐标
　　startY = this.data.startY,//开始Y坐标
　　touchMoveX = e.changedTouches[0].clientX,//滑动变化坐标
　　touchMoveY = e.changedTouches[0].clientY,//滑动变化坐标
　　//获取滑动角度
　　angle = this.angle({ X: startX, Y: startY }, { X: touchMoveX, Y: touchMoveY });
　　this.data.list.forEach(function (v, i) {
　　v.isTouchMove = false
　　//滑动超过30度角 return
　　if (Math.abs(angle) > 30) return;
　　if (i == index) {
　　if (touchMoveX > startX) //右滑
　　v.isTouchMove = false
　　else //左滑
　　v.isTouchMove = true
　　}
　　})
　　// //更新数据
　　this.setData({
　　list: this.data.list
　　})
　　},到此，相信大家对“小程序滑动删除功能怎么实现”有了更深的了解，不妨来实际操作一番吧！这里是百云主机网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！

相关推荐: mybatis动态拼接怎么实现有条件的插入

本文小编为大家详细介绍“mybatis动态拼接怎么实现有条件的插入”，内容详细，步骤清晰，细节处理妥当，希望这篇“mybatis动态拼接怎么实现有条件的插入”文章能帮助大家解决疑惑，下面跟着小编的思路慢慢深入，一起来学习新知识吧。那就是根据场景不同，然后实现有…