2c4b91c6354612c2aae0d71a56c6a75e3432ebd0d31b84ced4d46adea640ce4a7301a0c745357b87bed63859e9961ef1ace013759b30f5852ae56b690163cb 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var lodashUnified = require('lodash-unified');
  5. var shared = require('@vue/shared');
  6. var error = require('../../../utils/error.js');
  7. var scroll = require('../../../utils/dom/scroll.js');
  8. var position = require('../../../utils/dom/position.js');
  9. const SCOPE = "ElInfiniteScroll";
  10. const CHECK_INTERVAL = 50;
  11. const DEFAULT_DELAY = 200;
  12. const DEFAULT_DISTANCE = 0;
  13. const attributes = {
  14. delay: {
  15. type: Number,
  16. default: DEFAULT_DELAY
  17. },
  18. distance: {
  19. type: Number,
  20. default: DEFAULT_DISTANCE
  21. },
  22. disabled: {
  23. type: Boolean,
  24. default: false
  25. },
  26. immediate: {
  27. type: Boolean,
  28. default: true
  29. }
  30. };
  31. const getScrollOptions = (el, instance) => {
  32. return Object.entries(attributes).reduce((acm, [name, option]) => {
  33. var _a, _b;
  34. const { type, default: defaultValue } = option;
  35. const attrVal = el.getAttribute(`infinite-scroll-${name}`);
  36. let value = (_b = (_a = instance[attrVal]) != null ? _a : attrVal) != null ? _b : defaultValue;
  37. value = value === "false" ? false : value;
  38. value = type(value);
  39. acm[name] = Number.isNaN(value) ? defaultValue : value;
  40. return acm;
  41. }, {});
  42. };
  43. const destroyObserver = (el) => {
  44. const { observer } = el[SCOPE];
  45. if (observer) {
  46. observer.disconnect();
  47. delete el[SCOPE].observer;
  48. }
  49. };
  50. const handleScroll = (el, cb) => {
  51. const { container, containerEl, instance, observer, lastScrollTop } = el[SCOPE];
  52. const { disabled, distance } = getScrollOptions(el, instance);
  53. const { clientHeight, scrollHeight, scrollTop } = containerEl;
  54. const delta = scrollTop - lastScrollTop;
  55. el[SCOPE].lastScrollTop = scrollTop;
  56. if (observer || disabled || delta < 0)
  57. return;
  58. let shouldTrigger = false;
  59. if (container === el) {
  60. shouldTrigger = scrollHeight - (clientHeight + scrollTop) <= distance;
  61. } else {
  62. const { clientTop, scrollHeight: height } = el;
  63. const offsetTop = position.getOffsetTopDistance(el, containerEl);
  64. shouldTrigger = scrollTop + clientHeight >= offsetTop + clientTop + height - distance;
  65. }
  66. if (shouldTrigger) {
  67. cb.call(instance);
  68. }
  69. };
  70. function checkFull(el, cb) {
  71. const { containerEl, instance } = el[SCOPE];
  72. const { disabled } = getScrollOptions(el, instance);
  73. if (disabled || containerEl.clientHeight === 0)
  74. return;
  75. if (containerEl.scrollHeight <= containerEl.clientHeight) {
  76. cb.call(instance);
  77. } else {
  78. destroyObserver(el);
  79. }
  80. }
  81. const InfiniteScroll = {
  82. async mounted(el, binding) {
  83. const { instance, value: cb } = binding;
  84. if (!shared.isFunction(cb)) {
  85. error.throwError(SCOPE, "'v-infinite-scroll' binding value must be a function");
  86. }
  87. await vue.nextTick();
  88. const { delay, immediate } = getScrollOptions(el, instance);
  89. const container = scroll.getScrollContainer(el, true);
  90. const containerEl = container === window ? document.documentElement : container;
  91. const onScroll = lodashUnified.throttle(handleScroll.bind(null, el, cb), delay);
  92. if (!container)
  93. return;
  94. el[SCOPE] = {
  95. instance,
  96. container,
  97. containerEl,
  98. delay,
  99. cb,
  100. onScroll,
  101. lastScrollTop: containerEl.scrollTop
  102. };
  103. if (immediate) {
  104. const observer = new MutationObserver(lodashUnified.throttle(checkFull.bind(null, el, cb), CHECK_INTERVAL));
  105. el[SCOPE].observer = observer;
  106. observer.observe(el, { childList: true, subtree: true });
  107. checkFull(el, cb);
  108. }
  109. container.addEventListener("scroll", onScroll);
  110. },
  111. unmounted(el) {
  112. if (!el[SCOPE])
  113. return;
  114. const { container, onScroll } = el[SCOPE];
  115. container == null ? void 0 : container.removeEventListener("scroll", onScroll);
  116. destroyObserver(el);
  117. },
  118. async updated(el) {
  119. if (!el[SCOPE]) {
  120. await vue.nextTick();
  121. } else {
  122. const { containerEl, cb, observer } = el[SCOPE];
  123. if (containerEl.clientHeight && observer) {
  124. checkFull(el, cb);
  125. }
  126. }
  127. }
  128. };
  129. exports.CHECK_INTERVAL = CHECK_INTERVAL;
  130. exports.DEFAULT_DELAY = DEFAULT_DELAY;
  131. exports.DEFAULT_DISTANCE = DEFAULT_DISTANCE;
  132. exports.SCOPE = SCOPE;
  133. exports["default"] = InfiniteScroll;
  134. //# sourceMappingURL=index.js.map