touch.js 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. "use strict";
  2. exports.__esModule = true;
  3. exports.TouchMixin = void 0;
  4. var _event = require("../utils/dom/event");
  5. function getDirection(x, y) {
  6. if (x > y) {
  7. return 'horizontal';
  8. }
  9. if (y > x) {
  10. return 'vertical';
  11. }
  12. return '';
  13. }
  14. var TouchMixin = {
  15. data: function data() {
  16. return {
  17. direction: ''
  18. };
  19. },
  20. methods: {
  21. touchStart: function touchStart(event) {
  22. this.resetTouchStatus();
  23. this.startX = event.touches[0].clientX;
  24. this.startY = event.touches[0].clientY;
  25. },
  26. touchMove: function touchMove(event) {
  27. var touch = event.touches[0]; // safari back will set clientX to negative number
  28. this.deltaX = touch.clientX < 0 ? 0 : touch.clientX - this.startX;
  29. this.deltaY = touch.clientY - this.startY;
  30. this.offsetX = Math.abs(this.deltaX);
  31. this.offsetY = Math.abs(this.deltaY); // lock direction when distance is greater than a certain value
  32. var LOCK_DIRECTION_DISTANCE = 10;
  33. if (!this.direction || this.offsetX < LOCK_DIRECTION_DISTANCE && this.offsetY < LOCK_DIRECTION_DISTANCE) {
  34. this.direction = getDirection(this.offsetX, this.offsetY);
  35. }
  36. },
  37. resetTouchStatus: function resetTouchStatus() {
  38. this.direction = '';
  39. this.deltaX = 0;
  40. this.deltaY = 0;
  41. this.offsetX = 0;
  42. this.offsetY = 0;
  43. },
  44. // avoid Vue 2.6 event bubble issues by manually binding events
  45. // https://github.com/vant-ui/vant/issues/3015
  46. bindTouchEvent: function bindTouchEvent(el) {
  47. var onTouchStart = this.onTouchStart,
  48. onTouchMove = this.onTouchMove,
  49. onTouchEnd = this.onTouchEnd;
  50. (0, _event.on)(el, 'touchstart', onTouchStart);
  51. (0, _event.on)(el, 'touchmove', onTouchMove);
  52. if (onTouchEnd) {
  53. (0, _event.on)(el, 'touchend', onTouchEnd);
  54. (0, _event.on)(el, 'touchcancel', onTouchEnd);
  55. }
  56. }
  57. }
  58. };
  59. exports.TouchMixin = TouchMixin;