# 步骤条

步骤条组件可以起到导航的作用,明确当前操作节点位于整个操作流程中的位置,也可以指导后续仍有几个操作节点。

# 概念说明

# 属性

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

# 步骤条

  • 值: 当前步骤数,Integer类型。
  • 步骤条方向:步骤条的方向,支持横向或竖向。
  • 尺寸:设置尺寸,支持正常或自适应。

# 步骤条项

  • 图标:在该步骤展示的图标。
  • 禁用:禁用该项。

# 事件

# 步骤条

事件名 触发条件
选择后 选择某一步骤时触发
改变后 步骤数改变后触发

# 步骤条项

步骤条项不支持配置事件。

# 样式

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

# 主题样式

  • item-color-disabled: 步骤条禁用项文字颜色,如#223325
  • item-radio-size: 步骤条按钮大小,如1px。
  • item-radio-background: 步骤条按钮之间的进度条颜色(未完成部分),如#223325
  • item-radio-background-passed: 步骤条按钮和进度条颜色(已完成部分),如#223325
  • item-radio-color: 步骤条按钮图标颜色,如#223325
  • item-radio-color-passed: 步骤条按钮图标颜色(已完成部分),如#223325
  • item-radio-color-selectd: 步骤条按钮图标颜色(已选中部分),如#223325
  • item-radio-background-disabled: 步骤条按钮背景色(禁用状态),如#223325
  • border-color-passed: 步骤条按钮边框颜色(完成状态),如#223325
  • background-selected: 步骤条按钮圆心背景色(选中状态),如#223325
  • radio-background: 步骤条按钮背景色,如#223325
  • radio-border-color: 步骤条按钮边框颜色,如#223325
  • radio-border-color-disabled: 步骤条按钮边框颜色(禁用状态),如#223325
  • radio-background-selected: 步骤条按钮背景色(选中状态),如#223325
  • item-radio-border-color-hover: 步骤条按钮边框颜色(hover状态),如#223325
  • item-title-padding-left: 步骤项标题左边距。
  • item-line-margin-left: 步骤项连接线左边距。
  • item-line-margin-right: 步骤项连接线右边距。
上次更新: 2023年06月16日