Skip to content

Menu 菜单

导航菜单是一个网站的灵魂,用户依赖导航在各个页面中进行跳转。

基础用法

默认是侧边栏,通过x-sub-menu属性来指定子菜单,通过x-menu-item属性来指定菜单项。defaultActive属性来指定默认激活的菜单项。width属性来指定菜单的宽度吗,这个只有在侧边栏模式下才生效。index是必填且必须是唯一的属性,用来标识菜单项。

  • 处理中心
  • 我的工作台
  • 产品
  • 品牌
  • 订单管理

改变模式

通过mode属性来改变菜单的模式,有horizontalvertical模式。

  • 处理中心
  • 我的工作台
  • 产品
  • 品牌
  • 订单管理

自定义标题

通过title 插槽来自定义菜单的标题。

  • 处理中心
  • 我的工作台
  • 产品
  • 品牌
  • 订单管理

属性

参数说明类型可选值默认值
defaultActive默认激活菜单的 indexstring""
mode菜单模式stringhorizontal / verticalvertical
width菜单宽度stringauto
backgroundColor菜单背景色string
textColor菜单文字颜色string

事件

事件名说明回调参数
change子菜单展开/收起时触发当前子菜单的 index
toggle点击菜单项时触发当前菜单项的 index
enter鼠标进入子菜单时触发(仅在 horizontal 模式下生效)当前子菜单的 index
leave鼠标离开子菜单时触发(仅在 horizontal 模式下生效)当前子菜单的 index