framer-motion AnimatePresence布局问题

framer-motion AnimatePresence layout issue

我在使用 framer-motion AnimatePresence component 时遇到问题。

在幻灯片之间切换时,幻灯片的布局 "shrinks" 片刻,然后再提取回其所需的尺寸。经过一些调试后,我很确定这是因为 AnimatePresence 在一小会儿同时渲染两张幻灯片,但是我没能解决这个问题。

这里是sandbox demonstrating the issue.

使用 new beta exitBeforeEnter prop 成功了:

<AnimatePresence exitBeforeEnter>
  ...
</AnimatePresence>

如果您不想使用测试版功能,您可以延迟退出变体。

此外,可能需要绝对定位幻灯片。

https://codesandbox.io/s/infallible-ganguly-38mmc