docs_vue2/one/docs/components/steps.md

Steps 步骤

示例

尺寸及方向

可选的 ui 属性值：s/m/vertical/label-vertical。

步骤状态

可以通过设置 steps 的 status 属性值定义步骤状态，若步骤出错，可设置为 error。

API

属性

名称	类型	默认值	描述
ui	string=	-	[^ui]
steps	Array	-	[^steps]
current	number	-	当前步骤的索引值。

^^^ui 预设样式。

+++枚举值

值	描述
s	小尺寸样式。
m	中尺寸样式。
vertical	纵向样式。
label-vertical	文案纵向样式。
+++
^^^

^^^steps 步骤数据源。类型为 { label, desc, to, status }。

+++字段详情 | 名称 | 类型 | | 描述 | | -- | -- | -- | | label | string | 步骤标题。 | | desc | string | 步骤描述。 | | to | string|Object | 步骤链接。类型见 Link 组件的同名属性。 | | status | string | 步骤状态。可选值为默认和 error。 | +++ ^^^

插槽

名称	描述
default	[^slot-default]
index	序号部分内容，默认显示从 1 开始的序号，已完成的步骤显示完成图标，出错的步骤显示出错图标。位于 default 内部，作用域参数同 default。
label	步骤标题部分内容，默认显示 steps 中项目的 label 字段。位于 default 内部，作用域参数同 default。
desc	步骤描述部分内容，默认显示 steps 中项目的 desc 字段。位于 default 内部，作用域参数同 default。

^^^slot-default 整个步骤项内容。

默认内容：序号/完成图标、步骤标题、描述等内容。

+++作用域参数

名称	类型	描述
label	string	步骤标题。同 steps 属性中项目的 label 字段。
desc	string	步骤描述。同 steps 属性中项目的 desc 字段。
to	`string	Object`
status	string	步骤状态。同 steps 属性中项目的 status 字段。
index	number	步骤索引值。

另外，steps 内数据项中除了上面描述的字段之外的其它字段也会自动通过 v-bind 进行绑定到作用域参数上。 +++ ^^^

事件

名称	描述
click	任意步骤被点击后触发，回调参数为 (index: number, event: Event)。其中 index 为被点击步骤的索引值，event 为相应的原生事件对象。

图标

名称	描述
success	已成功完成的步骤。
error	出错的步骤。