ReactCSSTransitionGroup没有为变换转换正确设置动画

Question

我在路线之间添加动画没有问题。但是，当我尝试简单的事情如下：

var IntroSection = React.createClass({
render: function(){
    return(

      <div id = "intro">

      <ReactCSSTransitionGroup transitionName="introFirst" transitionAppear={true} transitionAppearTimeout={1300}>
        <span key={"hello"}>  Hello, </span>
      </ReactCSSTransitionGroup>

     [...]
    </div>

的CSS：

  .introFirst-appear{
    opacity: 0;
    transform: translateX(-250px);
    transition: opacity 10s linear;
  }

  .introFirst-appear.introFirst-appear-active {
    opacity: 1;
    transform:translateX(0px);
  }

不透明度部分完美运行，但translateX部分根本不起作用。什么都没动。

div #intro的css，没有什么特别的，只有font，text-align，width，float:right

Answer 1

您只是指定应使用转换规则对不透明度进行动画处理。 Alos，根据this anwer，transform属性仅适用于块级元素。试着这样做：

.introFirst-appear {
     /*...*/
     display: inline-block;
     transition: opacity 10s linear, transform 10s linear;
}