ReactCSSTransitionGroupはクラスを追加していません

Question

非常に基本的なフェードイン/アウトアニメーションを持たせるためにReactCSSTransitionGroupを統合しようとしていますが、クラスは子に追加されません。コンソールで役立つものは何もありません。私は明白な間違いをしていますか？

import React from 'react'; 
 
import { connect } from 'react-redux' 
 
import history from '../history' 
 
import { Map } from 'immutable' 
 
import ReactCSSTransitionGroup from 'react/lib/ReactTransitionGroup' 
 

 
import TwitchChannel from './twitchChannel' 
 
import TwitchChannelAddForm from './twitchChannelAddForm' 
 

 
const component = React.createClass({ 
 

 
\t render: function() { 
 
\t \t return (
 
\t \t \t <div> 
 
\t \t \t \t <TwitchChannelAddForm /> 
 
\t \t \t \t <ReactCSSTransitionGroup transitionName="animation" transitionAppear={true}> 
 
\t \t \t \t \t {this.props.channels.map(ch => 
 
\t \t \t \t \t \t <TwitchChannel channel_id={ch.get('id')} key={ch.get('id')} /> 
 
\t \t \t \t \t)} 
 
\t \t \t \t </ReactCSSTransitionGroup> 
 
\t \t \t </div> 
 
\t \t) 
 
\t } 
 
}) 
 

 
function mapStateToProps(state) { 
 
\t return { 
 
    \t \t channels: state.getIn(['twitch', 'channels'], Map({})).toArray() 
 
\t } 
 
} 
 

 
export default connect(mapStateToProps)(component)

のCss

animation-enter { 
 
    opacity: 0.01; 
 
} 
 
.animation-enter.animation-enter-active { 
 
    opacity: 1; 
 
    transition: opacity 2s ease-in; 
 
}

Answer 1

OK]をので、私は問題を発見しました。

「react-addons-transition-group」パッケージをnpmでインポートしようとしたときにエラーが発生しましたので、パッケージを直接参照しました（ 'react/lib/ReactTransitionGroup'）。これにより、すべてのエラーは修正されましたが、コード自体は機能しませんでした。

npmで検索したところ、「react-addons-css-transition-group」というパッケージが見つかりました。インストールしてインポートした後、動作するようになりました。