1.
import ReactCssTransitionGroup from 'react-addons-css-transition-group'
2.
<ReactCssTransitionGroup component="div" transitionName="slide-up" transitionEnterTimeout={500} transitionLeaveTimeout={300}>
{ selectorIsShow
? <Selector
userInfoselect={Selectorinfo}
userInfohide={(e)=>this.userInfohide(e)}
selectrole={(value)=>this.selectrole(value)}/>
: ''
}
</ReactCssTransitionGroup>
3.
.slide-up-enter{
transition:all .5s;
transform:translateY(100%);
}
.slide-up-enter-active{
transform:translateY(0);
}
.slide-up-leave{
transition:all .3s;
transform:translateY(0);
}
4.
需要注意的地方:1.秒数对应 2. 100%是隐藏起来的,0是展示出来的
.slide-up-leave-active{
transform:translateY(100%);
}