Vue-Kalendar

Vue implementation of react-calendar

Demo

Try online demo here

Install

# npm
npm install v-kalendar

# yarn
yarn add v-kalendar

Usage

Install the plugin into Vue:

import VKalendar from 'v-kalendar'

app.use(VKalendar)

Add the default CSS:

import 'v-kalendar/dist/style.css'

<template>
  <Calendar v-model="date" />
</template>

Properties

| Prop | Type | Default | Description | |-----------------------|-----------------|-------------|---------------------------------------------------------------| | activeStartDate | Date | new Date()| Beginning of a period that shall be displayed | | defaultView | String | month | Determines which view is being displayed initially | | locale | String | undefined | Locale to use for the calendar | | localeFirstDayOfYear | Number | 0 | Number for the first day of the week | | maxDate | Date | undefined | Maximum allowed date | | maxDetail | String | month | Most Detailed view that user can see | | minDate | Date | undefined | Minimum allowed date | | minDetail | String | century | Least detailed view that user can see | | selectRange | Boolean | false | Allow the selection of date range | | showNeighboringMonth | Boolean | true | Visibility of days from previous and next months | | showWeekNumbers | Boolean | false | Visibility of the week numbers |