每次将相同的`ReactCSSTransitionGroup`应用于组件而不重用代码

Question

我在Modal：

中有以下ReactCSSTransitionGroup组件呈现

<ReactCSSTransitionGroup
  transitionName="modalTransition"
  transitionEnterTimeout={500}
  transitionLeaveTimeout={500}
  transitionAppearTimeout={500}
  transitionAppear
>
   <Modal />
</ReactCSSTransitionGroup>

这很好用，但我希望每次渲染Modal时都应用我的过渡。

据我了解，我无法将ReactCSSTransitionGroup放在Modal组件中，因为它需要在此之前进行渲染。

我可以做些什么来确保Modal始终拥有modalTransition ReactCSSTransitionGroup，而不是每次调用它时都重复包装代码？

Answer 1

我认为这就是您所需要的：https://facebook.github.io/react/docs/animation.html#animating-one-or-zero-items

您可以将<ReactCSSTransitionGroup>放在<Modal>内，只需在“转换更改”中更改关键属性