useHeights.js 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. import { watch, ref } from 'vue';
  2. export default function useHeights(mergedData, getKey, onItemAdd, onItemRemove) {
  3. var instance = new Map();
  4. var heights = new Map();
  5. var updatedMark = ref(Symbol('update'));
  6. watch(mergedData, function () {
  7. updatedMark.value = Symbol('update');
  8. });
  9. var heightUpdateId = 0;
  10. function collectHeight() {
  11. heightUpdateId += 1;
  12. var currentId = heightUpdateId;
  13. Promise.resolve().then(function () {
  14. // Only collect when it's latest call
  15. if (currentId !== heightUpdateId) return;
  16. // let changed = false;
  17. instance.forEach(function (element, key) {
  18. if (element && element.offsetParent) {
  19. var offsetHeight = element.offsetHeight;
  20. if (heights.get(key) !== offsetHeight) {
  21. //changed = true;
  22. updatedMark.value = Symbol('update');
  23. heights.set(key, element.offsetHeight);
  24. }
  25. }
  26. });
  27. });
  28. }
  29. function setInstance(item, ins) {
  30. var key = getKey(item);
  31. var origin = instance.get(key);
  32. if (ins) {
  33. instance.set(key, ins.$el || ins);
  34. collectHeight();
  35. } else {
  36. instance.delete(key);
  37. }
  38. // Instance changed
  39. if (!origin !== !ins) {
  40. if (ins) {
  41. onItemAdd === null || onItemAdd === void 0 ? void 0 : onItemAdd(item);
  42. } else {
  43. onItemRemove === null || onItemRemove === void 0 ? void 0 : onItemRemove(item);
  44. }
  45. }
  46. }
  47. return [setInstance, collectHeight, heights, updatedMark];
  48. }