2016-03-28 19 views
2

我試圖訪問componentWillMount掛鉤,以淡出不是轉換<Home>組件的子組件的畫布元素。 (中<Home>動畫本身工作正常。)ReactCSSTransitionGroup - 如何覆蓋componentWillLeave(回調)?

<ReactCSSTransitionGroup transitionName="screenTrans" transitionEnterTimeout={200} transitionLeaveTimeout={3000}> 
    <Home key={'home'} /> 
</ReactCSSTransitionGroup> 

Home.js:

export default class Home extends React.Component { 
    ... 
    componentWillLeave(callback) { 
     console.log("am i getting called?") // no! 
     this.fadeOutCanvas(); 
    } 
} 

我缺少什麼?謝謝...

回答

2

相當晚的答案,但我現在面臨同樣的問題。

事情是,你使用的是ReactCSSTransitionGroup,它不會調用像ReactTransitionGroup(不同組件)的回調。問題是,你需要的是同時做兩件(套CSS和調用你的回調)組件

從文檔:

當使用ReactCSSTransitionGroup,有沒有辦法通知你的組件時的過渡已經結束或執行圍繞動畫的更復雜的邏輯。如果您想要更細緻的控制,則可以使用較低級別的ReactTransitionGroup API,它提供了執行自定義轉換所需的掛鉤。

檢查周圍,我找不到任何東西,所以我會寫我自己的組件,並希望開源它!