# 下拉菜单

# 概念说明

提供弹出式的下拉菜单可供选择。

# 属性

组件通用属性请参见组件通用说明

# 下拉菜单

  • 样式类型:支持基础按钮样式、主要按钮样式、次要按钮样式、普通按钮样式共4种样式。

  • 弹出方向:设置下拉菜单的弹出位置,支持上、下、左、右、上左、上右、下左、下右、左上、左下、右上、右下共12个方向。

  • 禁用:置灰显示,且禁止任何交互(焦点、点击、选择、输入等)。

  • 弹出层展示依据:设置弹出层在html里的位置,支持引用元素下、全局body设置。当把下拉菜单放入某个组件,而组件overflow是hidden的时候,需要设置为全局body。

# 下拉菜单项

  • 文本:显示的文本内容。
  • 禁用:置灰显示,且禁止任何交互(焦点、点击、选择、输入等)。
  • 图标:菜单项前增加自定义图标显示。
  • 链接类型:支持页面跳转、下载链接。
  • 链接地址:链接地址配置。
  • 链接打开方式:支持新窗口、当前窗口、父级窗口、顶级窗口四种方式,其中父级窗口和顶级窗口仅适用于iframe组件嵌套的情况,若不存在嵌套,则打开方式同当前窗口。

# 事件

  • 下拉菜单组件不支持设置事件。
  • 下拉菜单项支持设置点击事件。

# 样式

样式说明请参见组件通用说明

# 主题样式

  • color-text:下拉菜单字体颜色,如 #223325。
  • color-text-hover:下拉菜单字体颜色(hover状态),如 #223325。
  • color-text-active:下拉菜单字体颜色(激活状态),如 #223325。
  • color-text-disabled:下拉菜单字体颜色(禁用状态),如 #223325。

# 示例图片

image-20220725102552150

上次更新: 2023年06月13日