将antdesign垂直时间线修改为水平时间线

Question

我需要在我使用antdesign作为 UI 库的基于 React 的应用程序中绘制水平时间线。根据文档，antdesign 时间线组件在这方面是很好的资源，但不幸的是它显然只支持垂直时间线。在继续寻找其他一些开源水平时间线或自己编写时间线之前，我想在这里问一下是否有任何方法可以将该垂直时间线转换为水平时间线。这是我用来进行一些更改以获得所需结果但没有取得任何成功的代码片段：

import { Timeline } from 'antd';

ReactDOM.render(
  <Timeline>
    <Timeline.Item color="green">Create a services site 2015-09-01</Timeline.Item>
    <Timeline.Item color="green">Create a services site 2015-09-01</Timeline.Item>
    <Timeline.Item color="red">
      <p>Solve initial network problems 1</p>
      <p>Solve initial network problems 2</p>
      <p>Solve initial network problems 3 2015-09-01</p>
    </Timeline.Item>
    <Timeline.Item>
      <p>Technical testing 1</p>
      <p>Technical testing 2</p>
      <p>Technical testing 3 2015-09-01</p>
    </Timeline.Item>
  </Timeline>
, mountNode);

Answer 1

我会改用<Steps>组件，它看起来相似但支持垂直/水平。