vue选择时间日期日历插件 : vuejs-date-calendar

vue移动端时间日期日历选择插件

Demo( 推荐手机端打开 )

https://zhangyongwnag.github.io/vuejs-date-calendar/example/#/Home

一、下载

npm install --save vuejs-date-calendar

or

yarn add vuejs-date-calendar

二、引入

import Vue from 'vue'
import DateCalendar from 'vuejs-date-calendar'

Vue.use(DateCalendar)

三、使用



四、配置

Api

Name Type Default Value Description
show Boolean false date calendar model.
date Object require startTime = {time : ‘1990-01-01’}
option Object option option
limit Object limit limit

Events

Name Arguments Description
cancel value (String) cancel
confirm value (String) confirm
change value (String) change

option

Name Type Default Value Description
type String ‘day’ ‘day’ or ‘min’
week Array [‘Mo’, ‘Tu’…], week arr [‘Mo’, ‘Tu’, ‘We’, ‘Th’, ‘Fr’, ‘Sa’, ‘Su’],
month Array [‘January’,…], month arr [‘January(一月)’, ‘February(二月)’, ‘March(三月)’,]
format String ‘YYYY-MM-DD’ type == ‘day’ ? ‘YYYY-MM-DD’ : ‘‘YYYY-MM-DD HH:mm’’
color Object {…} { checked: ‘#F50057’,header: ‘#3f51b5’,headerText: ‘#fff’}
buttons Object {…} { ok: ‘OK’,cancel: ‘Cancel’ }
overlayOpacity String 0.5 overlay opacity : 0 - 1
dismissible Boolean true click close overlay

limit

Name Type Default Value Description
limit Array [], choice date cut {type: ‘fromto’,from: ‘1900-01-01’,to: ‘2019-01-01’}

五、链接

NPM : https://www.npmjs.com/package/vuejs-date-calendar
GitHub:https://github.com/zhangyongwnag/vuejs-date-calendar

你可能感兴趣的:(Vue)