如何使用react-spring和transition将高度动画化为已安装/未安装反应组件的“自动”值

问题描述 投票:0回答:1

有没有一种方法可以使用反应弹簧过渡将新安装的组件的高度从 0 动画到“自动”?经过研究,我发现只有通过动画最大高度而不是高度来解决方法。

工作示例https://codesandbox.io/s/react-spring-usetransition-example-forked-zknx6v?file=/src/index.js

reactjs transition react-spring
1个回答
0
投票

您需要将需要动画处理的组件包装到另一个块中,并使包装器的高度为 0。之后,在安装时,您可以从 ref 获取子级的高度,例如,并将包装器的高度动画化为子级的高度大小。

https://codesandbox.io/p/sandbox/zealous-water-5r8dzc

© www.soinside.com 2019 - 2024. All rights reserved.