跳转到内容

Timeline 时间轴

时间轴组件按时间顺序来展示了一系列的事件。

请注意:该组件不再出现在 Material Design 指南中, 但 Material-UI 会继续支持此组件。

基础的时间轴

一个基本的时间轴,显示事件列表。

  • Eat
  • Code
  • Sleep

Left-positioned timeline

时间轴的主要内容可以被放置在相对时间轴的左侧。

  • Eat
  • Code
  • Sleep
  • Repeat

交替的时间轴

时间轴可以显示在事件的两侧。

  • Eat
  • Code
  • Sleep
  • Repeat

Color 颜色

TimelineDot(时间点) 可以以不同的颜色呈现。

  • Secondary
  • Success
Press Enter to start editing

描边

  • Eat
  • Code
  • Sleep
  • Repeat

相反的内容

时间线可以在另外一侧呈现内容。

  • 09:30 am
    Eat
  • 10:00 am
    Code
  • 12:00 am
    Sleep
  • 9:00 am
    Repeat

定制的时间轴

以下是自定义组件的一个示例。 You can learn more about this in the overrides documentation page.

  • 9:30 am
    Eat

    Because you need strength

  • 10:00 am
    Code

    Because it's awesome!

  • Sleep

    Because you need rest

  • Repeat

    Because this is the life you love!

API

See the documentation below for a complete reference to all of the props and classes available to the components mentioned here.