ElementUI侧边栏导航菜单隐藏显示问题

场景：后台系统，实现侧边栏的隐藏显示功能

使用ElementUI布局容器时

---

需要注意的情况

在使用<el-aside>标签时，默认的宽度是60px。

如果要实现隐藏显示的话，则需要添加width="initial"属性

<el-aside width="initial"></el-aside>
复制代码

使用自带的隐藏显示功能时

---

需要注意的情况

设置侧边栏宽度时，必须将.el-menu--collapse排除，否则动画效果出现BUG

<el-menu class='demo'></el-menu>

// scss写法
.demo {
  height: 100vh;
  &:not(.el-menu--collapse) {
    width: 180px;
  }
}
复制代码

---

完成如上情况之后，就可以很愉快的实现侧边栏隐藏显示效果啦~~

转载于:https://juejin.im/post/5cac69cb6fb9a068b65e0c48