步骤线
v-stepper
组件用于显示步骤进度。
用例
A stepper can be used for a multitude of scenarios, including shopping carts, record creation and more.
API
名称
alt-labels
默认值
false
类型
boolean
将标签置于步骤的下方
名称
dark
默认值
false
类型
boolean
应用暗黑主题变体
名称
light
默认值
false
类型
boolean
应用明亮主题变体
名称
non-linear
默认值
false
类型
boolean
允许用户跳过任意一步
名称
value
默认值
undefined
类型
number | string
控制可见性
名称
vertical
默认值
false
类型
boolean
垂直显示步骤线
示例
可编辑步骤
用户随时可以选择可编辑的步骤并将跳转到该步。
不可编辑步骤
不可编辑步骤(Non-editable steps)强制用户在整个流程中进行线性处理。
可选步骤
可选步骤可由子文本调出。
水平步骤线
水平步骤线可以让用户定义沿x轴移动的步骤。
垂直步骤线
垂直步骤线可以让用户定义沿y轴移动的步骤。其他地方与水平方向的一致。
线性步骤
线性步骤始终沿着你定义的路径移动。
非线性步骤
非线性步骤可以让用户按照自己选择路线在流程中移动。
备用标签
步骤组件也有一个放置在步骤下方的备用标签样式。
多行表示的错误状态
可以显示错误状态来通知用户必须采取的一些行动。
备用标签样式的多行错误状态显示
错误状态的显示同样可以应用于备用标签样式。
垂直的多行错误状态显示
同样的,错误状态也可以应用于垂直的步骤。
动态步骤
步骤可以动态的添加和移除,如果删除的是当前处于激活状态的步骤,请务必通过更改应用模型来解决这个问题。