0.2.6 • Published 5 years ago
vue-calendar-easy v0.2.6
vue-calendar-easy
install
npm install vue-calendar-easy --save
Usage
<template>
<vue-calendar v-model="value" />
</template>
<script>
import VueCalendar from 'vue-calendar-easy'
export default {
components: {
VueCalendar
},
data () {
return {
value: null // Default selected date
}
}
}
</script>
Options
Props
Props | Type | Default | Description |
---|---|---|---|
value | Date | null | Default selected date |
daterange | Boolean | null | Optional date range |
begin_date.sync | Date | null | When :daterange="true" is true, default start date |
end_date.sync | Date | null | When :daterange="true" is true, default end date |
lazy | Boolean | true | When :daterange="true" is true, allow lazy loading |
one_calendar | Boolean | false | When :daterange="true" is true, display a single calendar |
separator | String | ~ | Separator symbol |
defaultNextMonth | Boolean | true | In multi-calendar mode, true shows the current month and next month, false shows last month and current month |
picker | String | date | Calendar type, "date" / "month" / "year" |
years | Number | 20 | Year range |
year_start | Number | 2000 | Start year |
rules | Array< String > | [] | Built-in filtering method, optional value please see below. |
custom_filter | Function | - | Please see below. |
mark_today | Boolean | true | Mark today |
calendar_width | String | '300px' | Calendar width |
calendar_height | String | '250px' | Calenfar height |
header_height | String | '40px' | Header height |
no_border | Boolean | false | Display border |
format | String | yyyy-MM-dd | Get formatted value |
/*
* @param date 日期
* @param type 日历类型 [date, month, year]
* @param index 索引 (默认为0,当 daterange 时为 0 或 1)
*/
function custom_filter (date, type, index) {
// 返回 true 则禁用
return Boolean
}
const rules = [
'fromToday', // 从今天起(包含今天)
'fromTomorrow', // 从明天起(不包含今天)
'untilToday', // 直至今天(包含今天)
'untilTomorrow', // 直至明天(不包含今天)
'unableSun', // 禁用周日
'unableMon', // 禁用周一
'unableTues', // 禁用周二
'unableWed', // 禁用周三
'unableThur', // 禁用周四
'unableFri', // 禁用周五
'unableSat' // 禁用周六
]
event
event | Description | Callback Arguments |
---|---|---|
complete | Callback when the date changes | date(type: object) / date_range(type: object), format_date(type: string) |
slot
slot | Description | Slot variables |
---|---|---|
default | Custom Calendar | in_range< Boolean >, year < Number >, month < Number >, day < Number > |
month | Custom Month Calendar | year < Number >, month < Number > |
year | Custom Year Calendar | year < Number > |
0.2.6
5 years ago
0.2.5
5 years ago
0.2.4
5 years ago
0.2.3
5 years ago
0.2.2
5 years ago
0.2.1
5 years ago
0.1.9
5 years ago
0.1.8
5 years ago
0.1.6
5 years ago
0.1.5
5 years ago
0.1.4
5 years ago
0.1.3
5 years ago
0.1.2
5 years ago
0.1.1
5 years ago
0.1.0
5 years ago
0.0.9
5 years ago
0.0.8
5 years ago
0.0.7
5 years ago
0.0.6
5 years ago
0.0.5
5 years ago
0.0.4
5 years ago
0.0.3
5 years ago
0.0.2
5 years ago
0.0.1
5 years ago