Steps 步骤条 #

引导用户按照流程完成任务的导航条。

获取组件 #

import { Steps } from 'rsuite';

// or
import Steps from 'rsuite/Steps';

演示 #

默认 #

设置标题 #

设置描述 #

垂直布局 #

设置错误状态 #

设置小尺寸 #

自定义图标 #

动态展示 #

Props #

<Steps> #

属性名称	类型 (默认值)	描述
classPrefix	string ('steps')	组件 CSS 类的前缀
current	number(0)	当前执行步骤
currentStatus	'finish' | 'wait' | 'process' | 'error' ('process')	当前执行步骤状态
small	boolean	设置小尺寸的步骤条
vertical	boolean	设置垂直显示

<Steps.Item> #

属性名称	类型 (默认值)	描述
classPrefix	string ('steps-item')	组件 CSS 类的前缀
description	ReactNode	设置描述
icon	Element<typeof Icon> ,	设置小尺寸的步骤条
status	'finish' | 'wait' | 'process' | 'error'	步骤状态
title	ReactNode	设置标题