18 Star 114 Fork 26

hengzq / hzqing-vue-timeline

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
MIT

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

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

Props(dataList)格式

name Description type
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 版本 第一次发布
MIT License Copyright (c) 2018 hzqing.com Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

简介

Vue时间轴插件 展开 收起
JavaScript 等 3 种语言
MIT
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
JavaScript
1
https://gitee.com/hengzq/hzqing-vue-timeline.git
git@gitee.com:hengzq/hzqing-vue-timeline.git
hengzq
hzqing-vue-timeline
hzqing-vue-timeline
master

搜索帮助