Reagent and DOM-based Functions

clojurescript

#1

Closure and other libraries have many great functions. Some just work – string formatting, auto-complete, etc; however, others expect to receive a DOM object and will then set up a watcher on that object. Every time I run in to one of these I have to stop and figure out how to handle it in a way that the function won’t attempt to set up the listener until after that DOM object has been rendered. Examples would be things needing modals or anything that receives a ByID-retrieved DOM object. What are the best ways to handle these DOM-dependent listener functions in Reagent?


#2

Use the :ref attribute to get a reference to your DOM element.

See: https://purelyfunctional.tv/guide/reagent/#refs


#3

Here’s the same from Reagent’s documentation: https://github.com/reagent-project/reagent/blob/4c369531ce2a61cb133a242124617a159a39d9b4/doc/FAQ/UsingRefs.md

Note that the atom in the purelyfunctional.tv link doesn’t have to be a ratom (reagent.core/atom) but can be a regular clojure atom (clojure.core/atom).