2014-11-17 25 views
7

ReactElement'in yaşam döngüsüne bağlı olarak animasyon gerçekleştirmenin bir yolunu bulmaya çalışıyorum, bileşen henüz yeni monte edildiğinde bir animasyon yapmak oldukça kolay, ancak bileşen ayrılmadan önce bir tane daha yaparım.Yaşam döngüsü canlandırmalarına tepki verme

ReactCSSTransitionGroup'u kullanamıyorum çünkü bu RequestAnimationFrame kullanmıyor.

Sadece benim durumum biraz açıklamak gerekirse, bileşenim kenar çubuğudur, bazı kullanıcıların girişlerine bağlı olarak açıp kapatabilirim.

Bileşen ayrılmadan önce bir animasyona sahip olmak için yolunuzu nasıl çalıştırırsınız diye merak ediyorum.

cevap

5

ReactCSSTransitionGroupcomponentWillEnter çağırır ReactTransitionGroup, componentDidEnter, componentWillLeave ve tanımlı CSS dayalı componentDidLeave sadece özel bir versiyonudur. CSS animasyonları kullanmak istemiyorsanız

, sadece ReactTransitionGroup kullanabilir ve these lifecycle hooks kullanarak RAF tabanlı animasyonlar uygulayan bir bileşeni kullanabilirsiniz: Burada

<ReactTransitionGroup component="div> 
    <MyCustomReactTransitionComponent key={...} /> 
</ReactTransitionGroup> 

başka SO sonrası bulunamadı bir örnek: http://jsbin.com/jebumipimo/1/edit?html,console,output

İlgili konular