---
url: /components/pro/FaTimeline.md
---
# FaTimeline 时间轴

垂直时间轴组件，支持时间分组显示和滚动激活效果。

## 使用场景

* 订单状态跟踪
* 项目进度展示
* 审批流程记录
* 用户操作日志
* 版本更新历史
* 活动时间线

## Props

| 属性 | 类型 | 默认值 | 说明 |
|------|------|--------|------|
| `data` | `T[]` | `[]` | 时间轴数据数组 |
| `merge` | `boolean` | `false` | 是否合并相同日期的时间标签 |
| `class` | `HTMLAttributes['class']` | - | 自定义 CSS 类 |

### 泛型约束

```ts
T extends { datetime: string | number | Date }
```

## Slots

| 名称 | 说明 | 作用域参数 |
|------|------|------------|
| `default` | 时间轴内容模板 | `item: T` - 当前时间项数据 |

## 注意事项

1. **数据格式**：`data` 数组中的每一项必须包含 `datetime` 字段（支持 Date、string、number 类型）
2. **时间格式**：推荐使用 ISO 格式字符串或 Date 对象，确保正确解析
3. **合并模式**：`merge` 为 true 时，相同日期的时间项只显示一个时间标签
4. **滚动效果**：组件会根据滚动位置自动激活对应时间点的年份/月份/日期显示
5. **内容自定义**：通过默认插槽可以完全自定义每个时间项的展示内容
6. **高度设置**：建议设置固定高度或放在可滚动容器中使用