Animate both mounting and unmounting of an Om component

Question

Is there a straightforward way to fade a component in when mounting, and fade a component out when unmounting?

I can get a component to fade in by using some jquery in the did-mount function, but getting it to fade out in the will-unmount function just doesn't work (the unmount happens instantly).

What is the standard way of animating the mounting and unmounting of Om components?

Answer 1

Take a look at my answer here.

Basically, you can use ReactCSSTransitionGroup from react-with-addons to create CSS transitions for mounting and unmounting:

(def css-trans-group (aget js/React "addons" "CSSTransitionGroup"))

...

(apply
  css-trans-group
  #js {:transitionName "example"}
  (om/build-all my-component list-of-data))))