--- order: 3 title: zh-CN: 步骤切换 en-US: Switch Step --- ## zh-CN 通常配合内容及按钮使用,表示一个流程的处理进度。 ## en-US Cooperate with the content and buttons, to represent the progress of a process. ````__react import { Steps, Button, message } from 'antd'; const Step = Steps.Step; const steps = [{ title: 'First', content: 'First-content', }, { title: 'Second', content: 'Second-content', }, { title: 'Last', content: 'Last-content', }]; class App extends React.Component { constructor(props) { super(props); this.state = { current: 0, }; } next() { const current = this.state.current + 1; this.setState({ current }); } prev() { const current = this.state.current - 1; this.setState({ current }); } render() { const { current } = this.state; return (