gbk/uxcore-timeline

uxcore-timeline

React timeline

Development

git clone https://github.com/uxcore/uxcore-timeline
cd uxcore-timeline
npm install
npm run server

if you'd like to save your install time，you can use uxcore-tools globally.

npm install uxcore-tools -g
git clone https://github.com/uxcore/uxcore-timeline
cd uxcore-timeline
npm install
npm run dep
npm run start

Test Case

npm run test

Coverage

npm run coverage

Demo

http://uxcore.github.io/components/timeline

Contribute

Yes please! See the CONTRIBUTING for details.

何时使用

• 当有一系列信息需要从上至下按时间排列时；
• 需要有一条时间轴进行视觉上的串联时；

API

<Timeline>
    <Timeline.Item>
        <p>2016-10-25</p>
        <p>content1</p>
        <p>content1</p>
    </Timeline.Item>
    <Timeline.Item>
        <p>2016-10-26</p>
        <p>content2</p>
        <p>content2</p>
    </Timeline.Item>
    <Timeline.Item color="gray">
        <p>2016-10-27</p>
        <p>content3</p>
        <p>content3</p>
    </Timeline.Item>
    <Timeline.Item color="gray">
        <p>2016-10-28</p>
        <p>content4</p>
        <p>content4</p>
    </Timeline.Item>
</Timeline>

Props

Timeline

时间轴。

Name	Type	Required	Default	Comments
className	String	false	无	额外类名
pending	jsx	false	无	指定最后一个幽灵节点内容

Timeline.Item

时间轴的每一个节点。

Name	Type	Required	Default	Comments
className	String	false	无	额外类名
color	String	false	orange	指定圆圈颜色 orange, blue, gray, green，或自定义的色值
dot	jsx	false	无	自定义时间轴点