useWatch.js 1.3 KB

123456789101112131415161718192021222324252627282930313233343536
  1. import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
  2. import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
  3. import { collectScroller, getWin } from "../util";
  4. export default function useWatch(open, target, popup, onAlign, onScroll) {
  5. useLayoutEffect(function () {
  6. if (open && target && popup) {
  7. var targetElement = target;
  8. var popupElement = popup;
  9. var targetScrollList = collectScroller(targetElement);
  10. var popupScrollList = collectScroller(popupElement);
  11. var win = getWin(popupElement);
  12. var mergedList = new Set([win].concat(_toConsumableArray(targetScrollList), _toConsumableArray(popupScrollList)));
  13. function notifyScroll() {
  14. onAlign();
  15. onScroll();
  16. }
  17. mergedList.forEach(function (scroller) {
  18. scroller.addEventListener('scroll', notifyScroll, {
  19. passive: true
  20. });
  21. });
  22. win.addEventListener('resize', notifyScroll, {
  23. passive: true
  24. });
  25. // First time always do align
  26. onAlign();
  27. return function () {
  28. mergedList.forEach(function (scroller) {
  29. scroller.removeEventListener('scroll', notifyScroll);
  30. win.removeEventListener('resize', notifyScroll);
  31. });
  32. };
  33. }
  34. }, [open, target, popup]);
  35. }