vue-dateselect

npm install vue-date-select

Usage

<template>
    ...
    <DateSelect></DateSelect>
    ...
</template>
<script>
import DateSelect from 'vue-date-select'
export default {
    // ...
    components: {
        DateSelect
    }
}
</script>

or in main.js

// ... 
import { DateSelect } from "vue-date-select";
Vue.component('DateSelect', DateSelect);
// ...

:Props

v-model - The component will give back an Object containing "day","month","year" properties

:dateFormat - String specifying the format of the displayed date and the order of the dropdown lists in the date-select.

Example:

:dateFormat="dd.mm.yyyy"
:dateFormat="mm-dd-yyyy" 
...
Any combination of "mm", "dd", "yyyy" separated by any of the 
following characters ".","-"," ".

Default value:

"dd.mm.yyyy"

:yearRange - Array of two elements where the first element is the beggining and the second element is the end of the year range.

Example:

:yearRange="[1900, 2019]"

Default value:

[1900, new Date().getFullYear()]

:startDay, :startMonth, :startYear - Number indicating at which element the drodown lists should be scrolled to at the beggining

Example:

:startDay="6"
:startMonth="6"
:startYear="2000"

Default value:

:startDay="15"
:startMonth="6"
:startYear="1965"

:locale (experimental) - Language for the months dropdown, and hopefully in future masking of the label with corresponding letters. Currently supported -> ["en_EN"," de_DE"].

Default value: "en_EN".

:dragscroll - Boolean indicating whether or not the dragscroll directive should be enabled on the dropdown lists.

Default value: true

@Events

@complete(dateObject) - Event fired when the date-select has a completed value.