vue-timeline
由于在vue沒(méi)找到適合的插件试吁，就自己封裝了一個(gè)基于css3的
插件地址：click me!
logo.png
預(yù)覽
特性
- 響應(yīng)式
- 鼠標(biāo)移入時(shí)間點(diǎn)有回調(diào)事件
使用方法
- 引入components底下的timeLine 并綁定points屬性
<timeLine :points="points"></timeLine>
- 配置每個(gè)時(shí)間點(diǎn)（可以缺少或不配置大部分選項(xiàng)）
points: [
{
pointColor: 'red', // important! the color of every time point and you can use red yellow or green *關(guān)鍵點(diǎn)顏色 可選red yellow green
img: 'http://www.jikexueyuan.com/event/static/images/bootstrap/bootstrap-logo.png', // img url for every time point 圖片地址 可留空
title: 'hello world', // important! title *時(shí)間點(diǎn)標(biāo)題
text: 'first post', // important! the content you want show *時(shí)間點(diǎn)內(nèi)容
linkUrl: 'https://www.google.com', // url for read more 鏈接url 留空則不顯示按鈕
linkText: 'Read detail', // show what in read for more button 按鈕顯示內(nèi)容 默認(rèn)為Read more
date: '2017-1-1' // time of the point 時(shí)間點(diǎn)
}
]
- currentPoint為綁定回調(diào)函數(shù)
<timeLine @currentPoint="your function"></timeLine>
