css - 在 React.js 中使用 CSS 动画

Question

我使用 React 已经有一段时间了，但动画是让我感到困惑的一件事。

目前我在我的 React 组件中使用 CSS。每个组件导入一个单独的 css 文件，我用它来设置样式而不是使用内联 css。

我的问题是:如果我有一个像登陆页面这样的页面，其中没有更新状态，是否可以在 css 中使用关键帧动画和类似的东西？

附带问题:我是否可以自由地将关键帧用于非更新页面(如登录页面)，或者它会完全破坏更复杂的页面？

Answer 1

您可以 100% 安全地在页面中使用您想要的任何 CSS。 CSS 只是一种用于描述元素的样式和呈现的语言。 React 不关心所有这些；它只关心 DOM页面的一部分——或者至少是 React 创建/控制的 DOM 部分。

The Document Object Model (DOM) [...] provides a structured representation of the document as a tree.

CSS 不会(不能)与 DOM 的树结构交互，CSS 动画也不会。它们只是将样式属性应用于元素，根据动画，这可能会给人一种 DOM 树布局发生变化的印象，但事实并非如此。

所以回答你的两个问题:无论实现如何，CSS 都不会破坏你的代码或以其他方式干扰 React。