Fork me on GitHub
#reagent
<
2022-02-28
>
pmooser20:02:21

I believe I misunderstood how reagent supports :ref fields on a DOM node. I thought the idea was that a function passed as a ref only got called upon mount and unmount, but it appears to me that it gets called on every render (well, twice for each render) in a component like this:

(defn simple
  []
  (let [s (r/atom "Hello!")]
    (fn []
      [:div {:ref (fn [el]
                    (println (if el "MOUNT" "UNMOUNT")))
             :on-click (fn [evt]
                         (swap! s str "!"))}
       @s])))
Or does that sound like it indicates that I'm doing something wrong?

p-himik20:02:30

That's because on each render, the value of :ref keeps changing since a function is never equal to another function, unless it's the same function. Try moving the :ref function into that let you have there.

pmooser07:03:01

@U2FRKM4TW Wow - that's so helpful. I somehow didn't realize that even the values of an attribute like that would effect that.

pmooser07:03:15

Thank you so much - that will make a huge impact on what I'm doing.

👍 1