A calendar component for vue.js compitable with vue 2.x
website: GilbertSun/vue-calendar
npm install vue-calendar-mobile
# for 1.x
npm install vue-calendar-mobile@1use in a vue component
<template>
<calendar :view="'month'"></calendar>
</template>
<script>
import Calendar from 'vue-calendar-mobile'
export default {
components: {
Calendar
}
}
</script>you want to change the source and see what's you change
$ make devit will server a locale demo page in http://localhost:8080
then you change change the source code in src directory
refresh the demo page
$ make deploypublish to npm
$ make pub| prop | type | description | example | default value |
|---|---|---|---|---|
| currentView | Object | cureent shown view | {}, simple pass a clean object | {start: Object, end: Object} |
| decorate | Object | control the date to have a dot docorate | {'2016-08-09': true} |
{} |
| sub | Object | control the date sub decorate | {'2016-08-09': {content: '休', color: '班'}}} |
{} |
| i18n | String | control week name language | 'zh-cn', 'en' |
'zh-cn' |
| indicator | Object | control the header indicator default the year and month | {title: ..., main: ...} |
{} |
| selected | Date | current select date | new Date(2016, 11, 6) | new Date() |
| startMonday | Boolean | is the week start from monday, true for monday and false for sunday | true | false |
| startDate | Date | this start Date to control the first view to show startDate | new Date(2016, 11, 6) | new Date() |
| view | String | show to month view of week view | 'month', 'week' | 'month' |
| centerHeader | Boolean | control the calendar header position | true | false |