小编Sco*_*ton的帖子

我整天都在扯头发，试图让它发挥作用。我注意到的是，无论出于何种原因，过渡类 (classNames="fade") 永远不会应用于页面元素。因此，当我从一个页面导航到另一个页面时，两个页面组件都会在短时间内（超时时间）显示。

我应该在 600 毫秒内拥有什么...

<div class="RTG"> 
    <div class="page fade-appear fade-enter fade-enter-active"> <!-- 
destination component HTML --></div>
    <div class="page fade-exit fade-exit-active"> <!-- start component HTML --></div>
</div>

我得到的是..

<div class="RTG">
   <!-- "fade..." classes never applied to the child nodes" -->
   <div class="page"> <!-- destination component HTML --></div>
   <div class="page"> <!-- start component HTML --></div>
</div>

然后在 600 毫秒超时后，我只剩下......

<div class="RTG">
   <div class="page"> <!-- destination component HTML --></div>
</div>

注意 1：我将“RTG”类名放在 TransitionGroup 组件上，只是为了验证我的“页面”类组件实际上是 TransitionGroup 组件的直接后代。不存在任何其他原因。

注意 2：我使用的是 react-transition-group@2.4.0，因为我与最新版本存在兼容性问题。 …