How can I trigger a click event on an element inside a Reagent component? I'd usually use React Refs but these are not available in Reagent

@martinklepsch Reagent does allow you to specify a :ref which can be a function or a string (here is a function example: http://stackoverflow.com/questions/39122243/reagent-component-that-orders-spans-by-their-computed-sizes) For the alternative file selection button I prefer to just wrap the input in a label (clicking the label opens the file dialog):

[:label
         [:input
          {:type "file"
           :accept "image/*"
           :style {:display "none"}
           :on-change
           (fn image-selected [e]
             (let [r (js/FileReader.)]
               (set! (.-onload r)
                     (fn [e]
                       (reset! img (.. e -target -result))))
               (.readAsDataURL r (aget (.. e -target -files) 0))))}]
         [:span.mdl-button.mdl-button--icon
          {:title "Background"}
          [:i.material-icons "image"]]]

@timothypratley so I eventually ended up just using a random UUID as :id + goog.dom/getElement which is a reasonable solution I guess. I know that I can pass refs to nodes but what I fail to understand is how I can retrieve them. Using a function as value (which I didn't know about) it seems I could stash the element in an atom so I can retrieve it later but that seems a good bit more complex than how you'd use refs usually

@martinklepsch, ref callbacks are great and pretty simple. For some background see https://github.com/timarney/react-faq#refs

and https://gist.github.com/pesterhazy/4d9df2edc303e5706d547aeabe0e17e1

@pesterhazy thanks! Didn't know about callback refs so that didn't come to mind but seems like a solid approach

For now I'm ok with just giving it a random ID, not perfect but certainly good enough ¯\(ツ)/¯