reagent

A minimalistic ClojureScript interface to React.js http://reagent-project.github.io/
p-himik 2020-06-23T18:28:39.210Z

Suppose I have this component:

(defn panel [value]
  (r/with-let [f (fn []
                   (do-something-with value))]
    [:button {:on-click f}
     (create-str-label value)]))
If value changes, the button will be displayed with a new label. But f will still reference the old one, right? And to force it to reference the new value, I have to rerender the whole component, and the only way to do that would be to set :key from the outside and make it depend on value, right?

p-himik 2020-06-23T18:36:21.211700Z

Just tested it - all assumptions seem to be correct, except for the "the only way" part. As an alternative, I can create a level of indirection via an intermediate ratom (or I guess it can or even should be a regular atom since I don't rely on it for rendering):

(defn panel [value]
  (r/with-let [inner-value (r/atom value)
               f (fn []
                   (do-something-with @inner-value))]
    (reset! inner-value value)
    [:button {:on-click f}
     (create-str-label value)]))
Looks ugly but at least it doesn't force me to come up with a way to derive a :key from a value which can be any value. Is it a known pattern? I don't think I've ever seen it documented anywhere.