瀏覽代碼

fix: don't hide lazy components if they're above the current scroll top

Tienson Qin 3 年之前
父節點
當前提交
d07f8eca8a
共有 1 個文件被更改,包括 7 次插入13 次删除
  1. 7 13
      src/main/frontend/ui.cljs

+ 7 - 13
src/main/frontend/ui.cljs

@@ -926,16 +926,10 @@
 (rum/defc lazy-visible
   [content-fn]
   (let [[hasBeenSeen setHasBeenSeen] (rum/use-state false)
-        inViewState (useInView {:rootMargin "0px 0px 0px 0px"
-                                :on-change (fn [v] (when v (setHasBeenSeen v)))})]
-    (rum/use-effect!
-     #(when (gobj/get inViewState "inView") (setHasBeenSeen true))
-     [(gobj/get inViewState "inView")])
-    (pprint {:ref (gobj/get inViewState "ref")}) ;; TODO: Remove pprints
-    (pprint {:inView (gobj/get inViewState "inView")})
-    (pprint {:hasBeenSeen hasBeenSeen})
-    (lazy-visible-inner
-     hasBeenSeen
-     content-fn
-     (gobj/get inViewState "ref"))
-    ))
+        inViewState (useInView #js {:rootMargin "100px"
+                                    :onChange (fn [v entry]
+                                                (let [self-top (.-top (.-boundingClientRect entry))
+                                                      v (if v v (if (> self-top 0) false true))]
+                                                  (setHasBeenSeen v)))})
+        ref (.-ref inViewState)]
+    (lazy-visible-inner hasBeenSeen content-fn ref)))