小程序
小游戏
企业微信
微信支付
扫描小程序码分享
是这样的,我现在做好了一个列表左滑出删除按钮的效果,我想做成像手机qq或微信那样。
初始左右滑,就不会再上下滑了。初始上下滑就不会再左右滑了。
在bindtouchmove函数中可以做到这样吗?
还望各位高手赐教。
6 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
小程序没有阻止默认事件,不能实现。推荐一篇文章你看一下http://www.jianshu.com/p/4af2d8fa66a9
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
不是第一项,是每一项。说错了。
是这样的,我有一个公告列表。
可以看到。一个屏幕是显示不全的。所以这个列表可以上下滚动嘛。
然后,第一项都可以左滑出删除按钮。
我想参考微信和qq的列表页面。在初始已经判断为左滑的情况下,竖直方向上不能移动。只能左右滑动。
为什么要阻止?场景可以说一下吗?
明白了,谢谢大神。
touchS: function (e) { var that = this; //console.log("touchS" + e); if (e.touches.length == 1) { var list = that.data.addressList; for (var i = 0; i < list.length; i++) { list[i].left = 0; } this.setData({ startX: e.touches[0].clientX, startY: e.touches[0].clientY }); }},touchM: function (e) { var that = this if (e.touches.length == 1) { var moveX = e.touches[0].clientX; var moveY = e.touches[0].clientY; var disX = that.data.startX - moveX; //获取滑动角度 var angle = that.angle({ X: that.data.startX, Y: that.data.startY, }, { X: moveX, Y: moveY }); if (Math.abs(angle) > 20) { this.setData({isScroll: false}); return; } var btnWidth = that.data.btnWidth; var left = ""; if (disX == 0 || disX < 0) { left = "left:0px"; } else if (disX > 0) { left = "left:-" + disX + "px"; if (disX >= btnWidth * 2) { left = "left:-" + btnWidth * 2 + "px"; } } var index = e.currentTarget.dataset.index; var list = that.data.addressList; list[index].left = left; this.setData({ addressList: list }); }},touchE: function (e) { //console.log("touchE" + e); var that = this if (!that.data.isScroll)return if (e.changedTouches.length == 1) { var endX = e.changedTouches[0].clientX; var disX = that.data.startX - endX; var btnWidth = that.data.btnWidth; var left = disX > btnWidth ? "left:-" + btnWidth * 2 + "px" : "left:0px"; var index = e.currentTarget.dataset.index; var list = that.data.addressList; list[index].left = left; that.setData({ addressList: list }); }},angle: function (start, end) { var _X = end.X - start.X, _Y = end.Y - start.Y //返回角度 return 360 * Math.atan(_Y / _X) / (2 * Math.PI);},
通过起始位置和结束位置求角度判断该不该上下滑动
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
小程序没有阻止默认事件,不能实现。推荐一篇文章你看一下http://www.jianshu.com/p/4af2d8fa66a9
不是第一项,是每一项。说错了。
是这样的,我有一个公告列表。
可以看到。一个屏幕是显示不全的。所以这个列表可以上下滚动嘛。
然后,第一项都可以左滑出删除按钮。
我想参考微信和qq的列表页面。在初始已经判断为左滑的情况下,竖直方向上不能移动。只能左右滑动。
为什么要阻止?场景可以说一下吗?
明白了,谢谢大神。
通过起始位置和结束位置求角度判断该不该上下滑动