Javascript “反应”；反应过渡基团“；不'；行不通

我正在将我的项目迁移到React的最后一个版本，我看到，

ReactCSTransanitionGroup

是。。。所以我使用React开发人员。当我使用

reactcstransitiongroup

组件渲染时，动画可以正常工作，但使用此软件包，组件无法工作，也无法设置动画

我做了一个简单的例子来测试，但不起作用。。。怎么了

反应代码：

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import CSSTransitionGroup from 'react-transition-group/CSSTransitionGroup';

class App extends Component {
    render() {
        return (
            <CSSTransitionGroup
              transitionName="example"
              transitionAppear={true}
              transitionAppearTimeout={3000}
              transitionEnter={true}
              transitionEnterTimeout={3000}
              transitionLeave={false}>

                <div id="container">
                    Animation test
                </div>

            </CSSTransitionGroup>
        );
    }
}

ReactDOM.render(
    <App />,
    document.getElementById('app')
);

在文档中：“您必须为CSSTransitionGroup的所有子项提供键属性，即使仅呈现单个项也是如此。这就是React将如何确定哪些子项已进入、离开或保留。”

此外，如果您希望在初始装载期间播放动画，还应检查css类名并添加“出现”前缀：

.example-appear {
    opacity: 0.01;
    border: 1px solid red;
}
.example-appear.example-appear-active {
    opacity: 1;
    transition: all 2s ease 0s;
    border: 1px solid orange;
}

在文档中：“您必须为CSSTransitionGroup的所有子项提供键属性，即使仅呈现单个项也是如此。这就是React将如何确定哪些子项已进入、离开或保留。”

此外，如果您希望在初始装载期间播放动画，还应检查css类名并添加“出现”前缀：

.example-appear {
    opacity: 0.01;
    border: 1px solid red;
}
.example-appear.example-appear-active {
    opacity: 1;
    transition: all 2s ease 0s;
    border: 1px solid orange;
}

---

。示例出现

正是我所需要的！我没有注意这个细节！非常感谢你<代码>。示例出现是我所需要的！我没有注意这个细节！非常感谢你！