touch.js 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. var startX
  2. var startY
  3. class touch {
  4. constructor() {
  5. }
  6. _touchstart(e, items) {
  7. //开始触摸时 重置所有删除
  8. items.forEach(function (v, i) {
  9. if (v.isTouchMove) //只操作为true的
  10. v.isTouchMove = false;
  11. })
  12. startX = e.changedTouches[0].clientX
  13. startY = e.changedTouches[0].clientY
  14. return items
  15. }
  16. _touchmove(e, items,key) {
  17. const id = e.currentTarget.dataset.id, //获取列表中每一项的唯一值,可以取id
  18. touchMoveX = e.changedTouches[0].clientX, //滑动变化坐标
  19. touchMoveY = e.changedTouches[0].clientY, //滑动变化坐标
  20. //获取滑动角度
  21. angle = this._angle({
  22. X: startX,
  23. Y: startY
  24. }, {
  25. X: touchMoveX,
  26. Y: touchMoveY
  27. });
  28. items.forEach(function (v, i) {
  29. v.isTouchMove = false
  30. //滑动超过30度角 return
  31. if (Math.abs(angle) > 30) return;
  32. if (v[key] == id) { //判断滑动的id与列表中的id是否一致,如果是的话,改变滑动这一项的isTouchMove属性
  33. if (touchMoveX > startX) //右滑
  34. v.isTouchMove = false
  35. else //左滑
  36. v.isTouchMove = true
  37. }
  38. })
  39. return items
  40. }
  41. _angle(start, end) {
  42. var _X = end.X - start.X,
  43. _Y = end.Y - start.Y
  44. //返回角度 /Math.atan()返回数字的反正切值
  45. return 360 * Math.atan(_Y / _X) / (2 * Math.PI);
  46. }
  47. }
  48. export default touch