framer-motion、styled-components 和 nextjs Link 组件没有动画答案

【问题标题】：framer-motion, styled-components and nextjs Link component not animatingframer-motion、styled-components 和 nextjs Link 组件没有动画
【发布时间】：2021-08-01 05:47:02
【问题描述】：

在创建framer-motionstyled-component 链接styled(motion.a)``; 时，如果它是nextjs Link 组件的子组件，我无法在其上触发动画。

nextjs Link 文档：

如果Link的子组件是函数组件，除了使用 passHref，你必须将组件包装在 React.forwardRef 中

https://nextjs.org/docs/api-reference/next/link#if-the-child-is-a-function-component

沙盒代表3种情况，只有一种触发动画，一种我没有将ref属性传递给样式化的运动链接组件

https://codesandbox.io/s/motion-link-does-not-animate-if-child-of-nextjs-link-component-q0by8?file=/pages/index.js

这是预期的行为吗？如果是，请解释为什么会这样？

【问题讨论】：

标签： next.js styled-components framer-motion

【解决方案1】：

问题已在framer-motion 4.1.16 中修复

【讨论】：