Przeglądaj źródła

set clean up handler for sticky event

Yuki Takei 5 lat temu
rodzic
commit
9ee022f942

+ 11 - 4
src/client/js/components/StickyStretchableScroller.jsx

@@ -96,6 +96,11 @@ const StickyStretchableScroller = (props) => {
   const resetScrollbarDebounced = debounce(100, resetScrollbar);
   const resetScrollbarDebounced = debounce(100, resetScrollbar);
 
 
 
 
+  const stickyChangeHandler = useCallback((event) => {
+    logger.debug('StickyEvents.CHANGE detected');
+    resetScrollbar();
+  });
+
   // setup effect by sticky event
   // setup effect by sticky event
   useEffect(() => {
   useEffect(() => {
     if (stickyElemSelector == null) {
     if (stickyElemSelector == null) {
@@ -107,10 +112,12 @@ const StickyStretchableScroller = (props) => {
     const stickyEvents = new StickyEvents({ stickySelector: stickyElemSelector });
     const stickyEvents = new StickyEvents({ stickySelector: stickyElemSelector });
     const { stickySelector } = stickyEvents;
     const { stickySelector } = stickyEvents;
     const elem = document.querySelector(stickySelector);
     const elem = document.querySelector(stickySelector);
-    elem.addEventListener(StickyEvents.CHANGE, (event) => {
-      logger.debug('StickyEvents.CHANGE detected');
-      resetScrollbar();
-    });
+    elem.addEventListener(StickyEvents.CHANGE, stickyChangeHandler);
+
+    // return clean up handler
+    return () => {
+      elem.removeEventListener(StickyEvents.CHANGE, stickyChangeHandler);
+    };
   }, []);
   }, []);
 
 
   // setup effect by resizing event
   // setup effect by resizing event