Лента времени

Отображение хода событий в хронологическом порядке. В режиме alternate элементы располагаются попеременно слева и справа; элементы поддерживают типы и полые узлы.

Лента времени

<template>
  <div class="demo-col">
    <p class="demo-note">mode="left" (по умолчанию)</p>
    <LhTimeline>
      <LhTimelineItem timestamp="2026-09-01" type="primary">Старт цифровизации «Полного собрания живописи Сун»</LhTimelineItem>
      <LhTimelineItem timestamp="2026-09-10" type="success">Завершён сбор 120 изображений в высоком разрешении</LhTimelineItem>
      <LhTimelineItem timestamp="2026-09-20" type="warning" hollow>При проверке цветокоррекции обнаружено 3 отклонения</LhTimelineItem>
      <LhTimelineItem timestamp="2026-10-01" type="danger">Проверка завершена, переиздание</LhTimelineItem>
    </LhTimeline>
    <p class="demo-note">mode="alternate" (попеременно слева и справа)</p>
    <LhTimeline mode="alternate">
      <LhTimelineItem timestamp="Северная Сун" type="primary">Фань Куань — *Путешествие по горам и рекам*</LhTimelineItem>
      <LhTimelineItem timestamp="Северная Сун" hollow>Го Си — *Ранняя весна*</LhTimelineItem>
      <LhTimelineItem timestamp="Династия Юань" type="success">Хуан Гунван — *Жилище в горах Фучунь*</LhTimelineItem>
    </LhTimeline>
  </div>
</template>

Timeline Props

Проп	Описание	Тип	По умолчанию
mode	Режим раскладки (alternate — попеременно слева и справа)	'left' \| 'alternate'	'left'
sx	Компактная раскладка через sx	—	—

TimelineItem Props

Проп	Описание	Тип	По умолчанию
timestamp	Временная метка	string	—
type	Тип узла	'primary' \| 'success' \| 'warning' \| 'danger'	—
hollow	Полый узел	boolean	false
sx	Компактная раскладка через sx	—	—

Slots

Слот по умолчанию TimelineItem: содержимое элемента.