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

标签 css reactjs

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

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

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

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

最佳答案

您可以 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。

关于css - 在 React.js 中使用 CSS 动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37612433/

相关文章:

jquery - 使用弹出消息确认删除 (jQuery)

javascript - 由于上下文中未使用的属性,组件重新呈现

javascript - undefined 不是一个对象(评估 'this.props.navigation")

javascript - 使用 timeUpdate 和 currentTime

html - Bootstrap 网格 : unexpected result with divs layout

jquery - 星级评分 jquery 星级评分小部件和 split 星的错误呈现

ruby-on-rails - react 组件未在我的 View 上呈现

javascript - 将 tidy-html5 与内联样式一起使用

javascript - 预期有一个赋值或函数调用,但在 React 中看到了表达式 no-unused-expressions 错误

javascript - 仅使用 ReactJS 专注于自定义模式