怎么手写一个antd的steps组件

要手写一个 Ant Design 的 Steps 组件，你需要按照以下步骤进行：

1. 安装 Ant Design 的依赖包。在项目根目录下运行以下命令：

   npm install antd --save

2. 在你的组件文件中引入所需的组件和样式文件：

   import React from 'react';
   import { Steps } from 'antd';
   import 'antd/dist/antd.css';

3. 创建一个 React 组件，并在 render 方法中渲染 Steps 组件：

   class MyStepsComponent extends React.Component {
     render() {
       const { Step } = Steps;

       return (
         <Steps>
           <Step title="Step 1" description="This is step 1" />
           <Step title="Step 2" description="This is step 2" />
           <Step title="Step 3" description="This is step 3" />
         </Steps>
       );
     }
   }

在上面的例子中，我们通过 `Steps` 组件创建了一个包含三个步骤的步骤条。`Step` 组件定义了每个步骤的标题和描述。

4. 最后，将该组件渲染到你的应用程序中的某个位置：

   ReactDOM.render(<MyStepsComponent />, document.getElementById('root'));

确保你已经在项目中正确引入了 React 和 ReactDOM，并将根元素的 ID 设置为 `root`。

现在，你应该能够在你的应用程序中看到一个包含三个步骤的步骤条。你可以根据自己的需求自定义步骤条的样式和配置。详细的文档可以在 Ant Design 官方网站上找到：https://ant.design/components/steps/