如何使成帧器运动与样式化的组件关键帧一起使用？

Question

documentation 如果将关键帧动画应用于组件，则诸如whileHover或onTap之类的任何事件均不适用于该motion.div。 例如，有时使用成帧动画无法使用z索引在关键帧动画期间使用样式化的组件为div设置动画的原因。我正在尝试将样式组件与framer-motion结合在一起。

Answer 1

您根本不会将关键帧与成帧器运动混合在一起。开发framer-motion的全部目的是使动画比使用CSS更简单，更易于使用。阅读文档并进行一些练习，以更好地掌握其功能。

我重新设置了您的代码，您可以在这里https://codesandbox.io/s/keyframe-plus-whilehover-forked-y7iqr?file=/src/App.js

进行检查