点击查看DEMO(建议使用开发者手机模式)
或者扫描二维码
![image](https://github.com/Blubiubiu/vue-super-calendar/raw/master/gif/demo.png?raw=true)
npm install vue-super-calendar --save
//main.js
import Vue from 'vue'
import vueCalendar from 'vue-super-calendar'
Vue.use(vueCalendar)
![image](https://github.com/Blubiubiu/vue-super-calendar/raw/master/gif/singlePage2.png?raw=true)
![image](https://github.com/Blubiubiu/vue-super-calendar/raw/master/gif/multiPage2.png?raw=true)
![image](https://github.com/Blubiubiu/vue-super-calendar/raw/master/gif/singleScroll4.png?raw=true)
![image](https://github.com/Blubiubiu/vue-super-calendar/raw/master/gif/multiScroll4.png?raw=true)
Name |
Type |
Default |
Description |
type |
String |
single |
single: 单选 multi: 复选 |
startDay |
String |
"" |
设置选定日期(仅针对type = single有效) e.g."2019/3/3" |
multiTxt |
Array |
["入住", "离店"] |
复选文本(建议不超过两个字) |
multiBefore |
Boolean |
false |
多选(是否允许选择当前日期之前的日期, 同时也会禁用往当前日期前翻页&滑动的功能) |
singleBefore |
Boolean |
false |
单选(仅针对mode = scroll有效)(是否允许选择当前日期之前的日期, 同时也会禁用往当前日期前翻页&滑动的功能) |
holiday |
Boolean |
false |
开启假日高亮颜色模式 |
festival |
Array |
[] |
特殊节日数组 e.g. ["2019/3/3"] |
yearBegin |
Number |
1 |
加载当前年份前N年(仅针对mode = scroll有效) |
yearEnd |
Number |
1 |
加载当前年份后N年(仅针对mode = scroll有效) |
Name |
Type |
Default |
Description |
show |
Function |
this.$refs.xxx.show() |
打开日历 |
hide |
Function |
this.$refs.xxx.hide() |
关闭日历 |
on-single-click |
Function |
val |
返回单选选中日期 |
on-multi-click |
Function |
startVal, endVal |
返回多选日期 |
on-warning |
Function |
|
禁止选择当前日期时翻到首页 |
npm install @babel/preset-env --save-dev
presets: ['@babel/preset-env']