【发布时间】：2021-08-27 07:50:45
【问题描述】：
我正在努力将 CSS 关键帧与 React 一起使用。
我可以让它们在组件被挂载时工作，但是当组件被卸载时，CSS 转换在状态从 DOM 中移除之前没有机会进行动画处理。
我并不热衷于使用 JS 库来做这件事，因为我觉得应该有一种方法可以用好的旧 CSS 来做到这一点。
我有一个代码笔，我把它放在一起来展示我到目前为止所拥有的东西。 https://codesandbox.io/s/react-hooks-usestate-forked-dhvu7?file=/src/styles.css
在动画结束时，我希望卸载组件，我不希望它留在 dom 中。
提前致谢。
【问题讨论】：
-
你应该首先添加一些类来向CSS发出信号它应该触发动画，然后你就拥有了一些选项：在你的反应代码中使用
setTimeout，然后实际删除元素，或者使用其他一些聪明的方法来知道动画何时完成，然后删除元素 -
从您的代码看来，您不需要 CSS
animation，而是一个简单的transition。只需添加一个具有所需 CSS 结果的类并在元素上设置transition属性，因此当该类出现时，它将转换为在该类上定义的那些属性
标签： javascript css reactjs