@aries0d0f/vue2-datepicker

vue2-datepicker

A responsive date range picker for Vue.js, support RWD.

Requirements

• Vue.js ^2.0.0

Installation

using npm:

$ npm install @aries0d0f/vue2-datepicker

using CDN:

<script src="https://unpkg.com/@aries0d0f/vue2-datepicker/dist/vue-datepicker.min.js"></script>

Usage

Internal

import VueDatepicker from '@aries0d0f/vue2-datepicker'

export default {
  components: {
    VueDatepicker
  }
}

Global

// At your main.js
import Vue           from 'vue'
import VueDatepicker from '@aries0d0f/vue2-datepicker'

Vue.component('VueDatepicker', VueDatepicker)

<vue-datepicker />

Props/Options

singleDateSelection

• Type: Boolean
• Default: false

Choose only one date, not a range.

<vue-datepicker :singleDateSelection="true" v-model="date" />

format

• Type: String
• Default: YYYY-MM-DD

The date format string.

<vue-datepicker :format="YYYY/MM/DD" v-model="date" />

startDate

• Type: String
• Default: new Date() // Today

The start view date. All the dates before this date will be disabled.

<vue-datepicker :startDate="new Date('2018-07-29')" v-model="date" />

endDate

• Type: String
• Default: Infinity

The end view date. All the dates after this date will be disabled.

i18n

• Type: Object
• Default:

i18n: {
  'day-names': [ 'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat' ],
  'start-date': 'Start Date',
  'end-date': 'End Date',
  'choose-date': 'Choose Date',
  'month-names': [ 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December' ]
}