如何用Vue2实现子菜单展开收缩动画效果？

本文共计465个文字，预计阅读时间需要2分钟。

以前进行这种操作很简单：display：block；但现在用户的要求越来越高，需要美观和动效感。

现在介绍一种简单的方式来实现子菜单的展开：从上方向下展开子菜单。

查看效果：

[点击查看效果]

以前做这种操作就是简单的display：block，但现在用户的要求也越来越高，需要美观和动画感。

现在介绍用一种简单的方式来实现子菜单从上向下展开子菜单。

看下效果图：

点开效果：

其实原理比较简单，就是通过子菜单的 max-height: 0;和 max-height: 2000px来实现子菜单的显示和关闭。加上css3的 transition: max-height .3s;来实现动画效果。