《Vue应用开发》课件——6.1.2ElementPlus中Menu组件.pptxVIP

导航栏是网页设计中不可或缺的一部分，通常应用于页面的顶部，可以帮助用户快速找到他们想要访问的内容。例如，导航栏可以实现页面之间的跳转。ElementPlus组件库提供了Menu组件，用于为网站提供导航功能。;Menu组件使用el-menu标签定义，在该标签中包含el-menu-item和sub-menu标签。菜单默认为垂直模式，通过将mode属性值设为horizontal，可以将导航菜单变更为水平模式。

el-menu标签的常用属性如下表所示。;演示顶部菜单栏效果;演示顶部菜单栏效果;演示顶部菜单栏效果;修改src\main.js文件，切换页面中显示的组件。;修改src\main.js文件，将导入style.css的代码进行注释，以免其影响Menu组件的样式效果。;在浏览器中查看ElementPlus顶部菜单栏效果如下图所示。;若想实现垂直菜单栏效果，可以修改上述代码，将el-menu标签中class的值改为el-menu-vertical-demo，将mode的值改为vertical。单击“我的”菜单项，会显示折叠的子菜单信息，如下图所示。