Vue实战048：动态图标样式Hamburger实现

1、常见的Hamburger样式我们可以看到，采用动态变化有种动态过渡效果，视觉上会比较柔和，更利于用户体验。因此我在项目中经常会用到一些Hamburger样式，可以实现很多种样式，基本原理就是通过改变每个横杠的角度、长度、透明度、位置来实现以下效果的，过度通过transition属性来定义。

3、CSS样式编写这里我把部分样式嵌入到了DATA数据中了，所以我们这里主要设置下通用样式即可，这里我们没有把所有的样式都写进来，就示范了几个，而且直接在同一个图标上进行改变的。

6、该功能没有难点，以上只是提供了一种实现的思路，这个主要还是控制CSS样式的，设置好DATA数据中的横杠的样式参数就可以了。