如何让我的 animate.css 动画永远循环？

问题描述

如何让我的 animate.css 动画永远持续下去？我尝试使用 animationIterationCount = "infinite"。但是，这似乎不起作用。

这是我正在使用的插件。 import { Flash } from 'animate-css-styled-components';

 <Flash duration=".8s" delay="1s" animationIterationCount = "infinite">
 <Button primary>LOG IN <aifillLock /></Button>
 </Flash>

谢谢！

解决方法

您需要使用 iterationCount 作为道具。

<Flash duration=".8s" delay="1s" iterationCount="infinite" >
 <Button primary>LOG IN <AiFillLock /></Button>
</Flash>

并确保您已安装样式组件。

,

这个 animation-iteration-count 属性在 CSS 中使用，如果你想以 JSX 的形式编写它，有 iterationCount 属性。您可以使用此道具并将其设置为 infinite。

所以对于你的情况：

<Flash duration=".8s" delay="1s" iterationCount="infinite">
  <Button primary>LOG IN <AiFillLock /></Button>
</Flash>