应用于图像的CSSTransitionGroup不会添加Enter-active类

问题描述

我是React动画的新手，我试图将动画添加到图像中，但是我编写的代码似乎无能为力。没有添加enter-active类或任何内容。在同一项目中，我使用了相同的模式为跨度设置动画，效果很好...

我使用图像src作为密钥。 src确实发生了变化，img也发生了变化，但是没有动画。

感谢所有感兴趣的人。

 <CsstransitionGroup  
    transitionName="monster-pic" 
    transitionEnterTimeout={5000} 
    transitionLeaveTimeout={5000}>
    <img key={image} src={image} alt={name} className="monster-picture"/>  
 </CsstransitionGroup>  

动画：

.monster-picture
  opacity 0.5
  transition all 5.5s 
  &.monster-pic-enter
    transition all 0.5s 
    opacity 1
    transform translateY(45px);
    &.monster-pic-enter-active
      border 2px solid yellow
      transform translateY(0px);
      position fixed
      opacity 0.1

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）