请教一下大家，如何判断初始左右滑动后不响应上下滑动？
是这样的，我现在做好了一个列表左滑出删除按钮的效果，我想做成像手机qq或微信那样。
初始左右滑，就不会再上下滑了。初始上下滑就不会再左右滑了。
在bindtouchmove函数中可以做到这样吗？
还望各位高手赐教。
6 回复
是这样的，我有一个公告列表。
可以看到。一个屏幕是显示不全的。所以这个列表可以上下滚动嘛。
然后，第一项都可以左滑出删除按钮。
我想参考微信和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);
},
通过起始位置和结束位置求角度判断该不该上下滑动
强力驱动