VTimeline API
组件页面
属性
| 名称 | 类型 | 默认值 |
|---|---|---|
| align | ||
| Places the timeline dot at the top or center of the timeline item. | ||
| density | ||
| Adjusts the vertical height used by the component. | ||
| direction | ||
| Display timeline in a vertical or horizontal direction. | ||
| dot-color | ||
| Color of the item dot. | ||
| fill-dot | ||
| Remove outer border of item dot, making the color fill the entire dot. | ||
| hide-opposite | ||
| Hide opposite content if it exists. | ||
| icon-color | ||
| Color of the icon. | ||
| justify | ||
| Places timeline line at the center or automatically on the left or right side. | ||
| line-color | ||
| Color of the timeline line. | ||
| line-inset | ||
| Specifies the distance between the line and the dot of timeline items. | ||
| line-thickness | ||
| Thickness of the timeline line. | ||
| side | ||
| Display all timeline items on one side of the timeline, either before or after. | ||
| size | ||
| Size of the item dot | ||
| tag | ||
| Specify a custom tag used on the root element. | ||
| theme | ||
| Specify a theme for this component and all of its children. | ||
| truncate-line | ||
| Truncate timeline directly at the start or end of the line, or on both ends. | ||
插槽
| default |
| The default Vue slot. |
SASS 变量
| 名称 | 默认值 |
|---|---|
| $timeline-density-comfortable-grid-template-end | |
| $timeline-density-comfortable-grid-template-start | |
| $timeline-density-compact-grid-template-end | |
| $timeline-density-compact-grid-template-start | |
| $timeline-divider-dot-elevation | |
| $timeline-divider-line-background | |
| $timeline-divider-line-horizontal-width | |
| $timeline-divider-line-thickness | |
| $timeline-dot-border-radius | |
| $timeline-dot-border-sizes | |
| $timeline-dot-divider-background | |
| $timeline-dot-size | |
| $timeline-inner-dot-divider-background | |
| $timeline-inset-divider-line | |
| $timeline-inset-line-size | |
| $timeline-item-grid-template-auto | |
| $timeline-item-grid-template-center | |
| $timeline-item-padding | |