在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((

和

onAnimationComplex((

然后进行逻辑运算。参考文献https://www.framer.com/docs/component/###onanimationstart