在 Framer Motion 标签、动画或初始道具中应用类

Question

如何使用 Framer Motion 标签，并在animate和initial属性中应用一个类。就像这样。

<motion.div
  initial={{ className: 'hidden' }}
  animate={{ className: 'visible' }}
>
  <div>yo</div>
</motion.div>

我必须使用类，因为我正在使用tailwindcss。

我期望并希望有一种方法可以做到这一点，就像我上面展示的例子一样，只需将其放入渲染的 HTML 标签中，style="class-name:{class_name}"它绝对不会执行任何操作。

提前致谢。

Answer 1

您可以将 vanilla js 与事件一起使用

onAnimationStart()

和

onAnimationComplate()

然后做你的逻辑。参考资料https://www.framer.com/docs/component/###onanimationstart