1.0.7 • Published 4 years ago

yoona-vue-timeline v1.0.7

Weekly downloads
3
License
MIT
Repository
github
Last release
4 years ago

hzqing-vue-timeline

A Vue component to hzqing-vue-timeline 一个Vue的时间插件

example (图片展示)

屏幕宽度大于1200px

HZQING

屏幕宽度小于1200px

HZQING

安装

npm install -S hzqing-vue-timeline

如何引入

main.js:

// 全局注册
import hzqingVueTimeline from 'hzqing-vue-timeline'
Vue.use(hzqingVueTimeline)

 <hzqing-vue-timeline></hzqing-vue-timeline>

配置

引入组件

   <hzqing-vue-timeline 
   timelineColor="#5bbcd5"  
   timeContentColor="#fff"
   :dataList="data"
   ></hzqing-vue-timeline>

组件数据

    data: [
        {
            time: 1522372393000,
            img: 'static/touxiang.jpeg',
            title: 'hzqing.com',
            content: '这是衡钊清的个人博客'
        },
        {
            time: '2018-03-30 14:36:35',
            img: 'static/one.jpeg',
            title: '这是一个简单的vue时间轴插件',
            content: '这是一个简单的vue时间轴插件,使用非常的方便'
        },
        {
            time: 1522372393000,
            img: 'static/three.jpg',
            title: '努力奋斗',
            content: '当你发现你的才华撑不起野心时,就请安静下来学习吧~~~'
        }
    ]

Props

nameDescriptiontypedefault
dataList数据Array
timelineColor时间轴插件整个背景颜色String#5bbcd5
timeContentColor文字内容背景颜色String#f2f2f2

Props(dataList)格式

nameDescriptiontype
time时间Date
img中间图片String
title标题String
content内容String

update(更新内容)

  • 2018-05-16 发布1.0.3 版本 引入vue-avatar插件,管理中间图片展示
  • 2018-03-30 发布1.0.2 版本 修改time数据格式为Date
  • 2018-03-29 发布1.0.1 版本
  • 2018-03-27 发布1.0.0 版本 第一次发布
1.0.7

4 years ago

1.0.6

4 years ago

1.0.5

4 years ago

1.0.4

4 years ago

1.0.3

4 years ago