Reactjs 可以为隐藏/删除的组件设置动画吗？

我知道使用

reactcstransitiongroup

可以将其应用于项目列表，然后在项目出现或消失时设置动画。但是一个组件呢

请看这里的JSFIDLE，在这里，当项目出现时，我有一个CSS动画。但我不知道是否有一种方法可以让它在被隐藏时变得生动

---

当然！只需使用

enter

和

leave

变量（尽管您应该始终呈现

TransitionGroup

组件）：

var TheThing=React.createClass({
render（）{
var分量；
如果（此.props.visible）{
组件=事物；
}
返回(
{component}
)
}
});

及

。输入{
不透明度：0.01；
过渡：不透明度1s，易于调节；
}
.thing-enter.thing-enter-active{
不透明度：1；
}
.东西离开{
不透明度：1；
过渡：不透明度1s，易于调节；
}
.thing-leave.thing-leave-active{
不透明度：0.01；
}

---

示例：

啊！我的印象是，

enter

/

leave

是一个项目列表，而

appeage

是一个项目列表。

出现

的意义是什么？它有什么区别？@ffxsam

出现

用于项目的初始外观，如果您使用

过渡外观

-也就是说，如果在装载包含组件时，

过渡组

及其子项已经装载，除非设置了

transitionAppear

，否则它不会设置动画。尝试在您的示例中设置

{thingIsVisible:true}

，然后在我的示例中设置。