april-vue-date

一个PC端的vue日期选择插件

Build Setup

##最近做项目用到个时间插件，用第三方的插件总感觉不好看 所以自己花了半天的时间写了一个日历插件 可以设置供用户选择的最大和最小时间间隔

第一步 项目引入插件

npm install april-vue-date -S  
或者 cnpm install april-vue-date -S (推荐)   
或者 yarn add april-vue-date

第二步 main.js 里全局引入日历插件

import aprilVueDate from 'april-vue-date'
Vue.use(aprilVueDate)

第三步 需要用的地方添加使用

<april-vue-date></april-vue-date>

配置项

defaultDate -------- 默认时间                 (可不写，默认为当前时间)
max-date    -------- 选择范围(最大可选择日期)   (可不写)
min-date    -------- 选择范围(最小可选择日期)   (可不写)
left        -------- 时间选择框距离左边的距离    (可不写)
width       -------- 时间选择框的长度          (可不写，默认为300)
height      -------- 时间选择框的高度           (可不写，默认为30)
color       -------- 时间选择框字体颜色         (可不写，默认为 #606266)
background  -------- 弹出时间选择模块的背景色    (可不写，默认为 #fff)
locale      -------- 语言包  值 zh：中文  en：英文  (可不写，默认为 zh  即中文)
@change-date -------- 用户确认选定的值时触发的函数  

示例如下

<april-vue-date 
  default-date='2017-08-07' @change-date='changeDate'
  max-date='2018-09-10' min-date='2018-07-10' 
  left='20' width='200' height='30' >
</april-vue-date>