I figured out how to get things working with ReactTransitionGroup

the re-frame tutorial (https://github.com/Day8/re-frame/wiki/Creating%20Reagent%20Components#form-3-a-class-with-life-cycle-methods) has you create the function my-component that creates a class every time you call it

then you have [my-component 1 2 3] to create an instance of your custom class

if you do something like

(def my-component (reagent/create-class {}))

[my-component 1 2 3]

if you do it the way the tutorial specifies, I think reagent “wraps” the custom components you create. Then ReactTransitionGroup tries to call componentWillEnter and other animation methods, but it’s trying to call them on the wrapper component, not the custom component

@nonrecursive: I've not had to do any of this myself. But I;'m aware of various fucntions in core, like this one: https://github.com/reagent-project/reagent/blob/master/src/reagent/core.cljs#L56-L62

Hi, I’m developing a SPA with reagent + re-frame and have run into some problems when binding data to components that allow text entry. I’ve found that if I bind the value of a textarea or whatever to some string in my app-state (using re-frame’s subscribe) then a flurry of on-change events can cause the cursor to jump around, or sometimes events are lossed. Is this a general problem with binding components that allow free text entry and updating them incrementally, or more likely to be a bug in my code?

An obvious workaround is to not update the app-state atom on every on-change event, but I like keeping the app-state and the view in sync. It feels more hygienic 🙂

@lsnape: react deals with this normally

see "controlled components" in https://facebook.github.io/react/docs/forms.html

@pesterhazy: will take a look, thanks!

@lsnape: this topic is also covered in this lambdaisland episode: https://lambdaisland.com/episodes/reagent-2-cursors

@lsnape re-frame has a sister library re-com which is designed to avoid this too