github仓库地址：https://github.com/wanghao12345/react-book
这里主要讲解使用react-transition-group里面的CSSTransition实现动画。
使用CSSTransition实现动画，一共分三步：
1.引用CSSTransition
1 import { CSSTransition } from 'react-transition-group'
2.使用CSSTransition将需要动画的元素包裹起来
1 <CSSTransition 2 in={this.state.focused} 3 timeout={200} 4 classNames='slide' 5 > 6 ........ 7 </CSSTransition> 8 9
in: 一个是否执行动画的标准，当in的值为true就开始执行入场动画，in的值为false就开始执行出场动画
timeout: 执行一个动画的时间
classNames:动画的class名称，为了描述具体动画做准备
3.样式描述动画效果
1 .slide-enter { 2 transition: all .2s ease-out; 3 } 4 .slide-enter-active { 5 240px; 6 } 7 .slide-exit { 8 transition: all .2s ease-out; 9 } 10 .slide-exit-active { 11 160px; 12 }
.xxx-enter：入场动画过渡参数设置
.xxx-enter-active ：入场动画的效果
.xxx-exit：出场动画的过渡参数设置
.xxx-exit-active：出场动画的效果
注意：xxx为第二步定义的CSSTransition的className