javascript - React CSSTransitionGroup 出现过渡仅适用于 2D 元素

Question

我使用 React 的 CSSTransitionGroup（新的 react-transition-group@1.1.2。我不知道为什么，但过渡是在应用 3D 样式之前进行的。

当前行为（在 Chrome 和 Firefox 中）：

1. 对象作为二维对象从不透明度淡入：0 到不透明度 1
2. 对象接收 3D 样式

预期行为：

1. 对象接收 3D 样式
2. 对象从不透明度淡入为 3D 对象：0 到不透明度 1

jsx：

   <CSSTransitionGroup component="div" id="container" transitionName="fadeBox" transitionAppear={true} transitionAppearTimeout={500}
          transitionEnter={false} 
          transitionLeave={false}>

          {this.state.projects.map((project) => {
            return (<Link to={"/project/" + project.id} key={"/project/" + project.id}>
              <Box imageURL={project.imageURL} text={project.text} key={project.id} /> </Link>)
          })}

        </CSSTransitionGroup>

CSS：

.fadeBox-appear {
    opacity: 0.01;
    transform: translate3d(0, -2%, 0);
}

.fadeBox-appear.fadeBox-appear-active {
    opacity: 1;
    transform: translate3d(0, 0%, 0);
    transition: all 0.5s ease-in-out;
}