在用element ui 组件搭建管理后台项目时,肯定会用到NavMenu 组件,此组件用来创建左侧菜单,代码片段如下:
<el-container>
<el-aside style="margin-top: 2px; width: auto">
<left-menu></left-menu>
</el-aside>
<el-main>
<right-content></right-content>
</el-main>
</el-container>
参考了这篇文章:使用ElementUI从零开始搭建后台管理系统教程_SongZhengxiang-的博客-CSDN博客_element 管理后台
定义左侧菜单组件为ElMenu,这是不对的,实践发现老是报溢出栈错误。有经验的前端老鸟看到ElMenu可能就知道问题在哪了。ElMenu组件名和element ui 的组件<el-menu> 名重名了,所以报溢出栈错误。换个名字就OK了。
在给左侧菜单增加一个伸缩按钮时,发现文字隐藏有一个1秒的迟钝才能消失。扒拉一下官网menu属性看着也没用错,最后才发现官网给出的例子中的一行代码的用处,
class="el-menu-vertical-demo"
加上这一行样式就OK了。