过渡到收缩/扩展到自动高度元素

恩德雷·萨博(EndreSzabó)

如何在vue中编写过渡以在消失时将元素缩小到0px,并在消失时将其扩展到自动高度。非常像不透明度0-1;

<transition name="shrink">

..

</transition
布萨吉拉·卜拉欣

您无法设置身高的动画,但可以使用以下方法max-height

.shrink-enter-active,
.shrink-leave-active {
    transition: all 0.5s ease-out;
    max-height: 400px;
}

.shrink-enter,
.shrink-leave-to {
    max-height: 0;
}

这是由我的侧边栏组件灵感在这里,代码是在这里

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章