Ant Design Vue ＜a-timeline＞时间轴组件失效解决方案

小杨同学呀呀呀呀2026-02-07 8:08

Ant Design Vue - 时间轴＜a-timeline＞组件没效果

踩坑实记

近期在开发中用到了Ant Design Vue中的 a-timeline 组件，把官方提供的代码复制粘贴到我的项目里发现样式没生效，控制台检查发现组件根本就没渲染上。

这是官方的效果

我项目中的效果

以下是解决方案，亲测好用！

1.在script中引入

复制代码

//引入时间轴
import { Timeline, TimelineItem } from 'ant-design-vue';

2.在页面中使用

复制代码

        <timeline>
              <timeline-item> </timeline-item>
         </timeline>

3.效果

这样时间轴组件就正常显示了，经验值+1