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 设置标题
Vercel banner