ElementUI浅尝辄止32:NavMenu 导航菜单

为网站提供导航功能的菜单。常用于网站平台顶部或侧边栏菜单导航。

1.如何使用?顶栏

/*导航菜单默认为垂直模式,通过mode属性可以使导航菜单变更为水平模式。另外,在菜单中通过submenu组件可以生成二级菜单。Menu 还提供了background-color、text-color和active-text-color,分别用于设置菜单的背景色、菜单的文字颜色和当前激活菜单的文字颜色。*/


  处理中心
  
    
    选项1
    选项2
    选项3
    
      
      选项1
      选项2
      选项3
    
  
  消息中心
  订单管理

处理中心 选项1 选项2 选项3 选项1 选项2 选项3 消息中心 订单管理

2.侧栏

垂直菜单,可内嵌子菜单。

//通过el-menu-item-group组件可以实现菜单进行分组,分组名可以通过title属性直接设定,也可以通过具名 slot 来设定。


  
    
默认颜色
选项1 选项2 选项3 选项1 导航二 导航三 导航四
自定义颜色
选项1 选项2 选项3 选项1 导航二 导航三 导航四

 3.展开折叠


  展开
  收起


  
    
    
      分组一
      选项1
      选项2
    
    
      选项3
    
    
      选项4
      选项1
    
  
  
    
    导航二
  
  
    
    导航三
  
  
    
    导航四
  




你可能感兴趣的:(element-ui,elementui)