我在我的项目中使用 React Router，并且在“概述”页面上有一个专辑卡列表，在“专辑”页面上有相同的专辑卡列表。唯一的区别是专辑页面略宽。
当有人更改路线时，我希望卡片转换到新的位置/尺寸，所以我已经将我的路由器包裹起来<AnimateSharedLayout type="crossfade">并给每张卡片相同的layoutId.
现在，它可以工作了，但我有几个问题，想知道它们是否可以修复（我确定我只是忽略了一些明显的东西）。
我在这里整理了一个精简的示例：https ://codesandbox.io/s/framer-animatesharedlayout-5kdfr （如果您在“概述”和“相册”之间单击，它应该执行转换）。
- 为什么交叉淡化可能无法正常工作？相反，卡片会立即跳转到末尾组件（我猜它忽略
crossfade了AnimateSharedLayout组件中的我并使用它来switch代替？为什么会那样做？） - 有没有办法让卡片的内部组件以某种方式反向缩放？（类似于 Matt 在https://www.framer.com/blog/posts/magic-motion/的帖子中的“更正子组件” ）例如，您可以在过渡期间看到文本挤压，即使它的大小相同在开始和结束时。
谢谢！