Hi everyone. With react-native+reagent I created a component using reagent/create-class and added few extra "lifecycle" functions (kinda like what https://github.com/madsleejensen/react-native-transitiongroup does) that I have planned to call from parent via :ref #(reset! ref %) to implement some animations/transitions. However, it looks like those functions are not visible in a ref I get. Does anyone know if this is something that should be doable while using Reagent components?

@pixell, that's exactly how I would approach it as well

could you post some code?

Specifically what function calls fail?

@pesterhazy, thanks. I'll try make a small example as this codebase makes posting code a bit tricky.

@pesterhazy, Now I had the time to create a HTML example: https://github.com/pixell/reagent-extra-methods-in-create-class-html/blob/master/src/reagent_extra_methods_in_create_class_html/core.cljs. It contains a view component with additional lifecycle function componentWillAppear. After creating the class I'll check that the function exists. These views are wrapped in transition-group that assigns refs to each children based on key. It also keeps a track of children in its state as some transitions outlive the visibility of element managed outside the transition-group. I removed the code responsible for transitions, but in :component-did-update of transition-group I get the element using a ref and it does not contain the callback. I'm thinking that the code I use to clone and render all children of transition-group might be the reason, but haven't yet figured out it.

interesting!

@pixell, not sure if reagent supports non-standard lifecycle methods: https://github.com/reagent-project/reagent/blob/0b91bc2580fd9211a58749153747c327d36e5b11/src/reagent/impl/component.cljs#L144

your reagent-render is doing some unusual things, maybe that interferes

you can normally just use [component {:ref (fn [r] ...)}]

why are you looking for the method componentWillAppear? Do you want to call it?

a workaround that will work for sure is to make a pure-react component, using react's normal createClass directly

you could try to get things working with that first, and then port to reagent

just brainstorming here 🙂 . I'm not familiar with transition-group

Thanks, I appreciate all the help I get 🙂 I would like to few common methods (mixin?) that do animations during transitions from a view to another. It's actually the animation when leaving a view that requires me to keep the element alive longer than the parent view does.

I will try new approach (either by [component {:ref (fn [r] ...)}] or plain React.

Is there a way to force a component to re-render when it returns false to shouldComponentUpdate?

Are there many instances/examples of people using reagent in a way that doesn’t use an SPA?

@jtth I personally only make SPAs and find that to be the predominant use case. However, there is nothing preventing reagent to be used in different html pages .. a convenience you lose is a shared app-state on the client between pages tho.