Skip to content

Latest commit

 

History

History
74 lines (59 loc) · 2.43 KB

README.md

File metadata and controls

74 lines (59 loc) · 2.43 KB

vue2-datepicker

A Datepicker Component For Vue2

Demo

https://mengxiong10.github.io/vue2-datepicker/

image

Install

$ npm install vue2-datepicker --save

Usage

<script>
import DatePicker from 'vue2-datepicker'

export default {
  components: { DatePicker },
  data() {
    return {
      time1: '',
      time2: '',
      shortcuts: [
        {
          text: 'Today',
          start: new Date(),
          end: new Date()
        }
      ]
    }
  }
}
</script>

<template>
  <div>
    <date-picker v-model="time1" :first-day-of-week="1"></date-picker>
    <date-picker v-model="time2" range :shortcuts="shortcuts"></date-picker>
  </div>
</template>

Attributes

Prop Type Default Description
range Boolean false if true, the type is daterange
format String yyyy-MM-dd Date formatting string
lang String zh Translation (en/zh/es/pt-br/fs)
placeholder String input placeholder text
width String/Number 210 input size
disabled-days Array [] Days in YYYY-MM-DD format to disable
not-before String '' Disable all dates before date in YYY-MM-DD format
not-after String '' Disable all dates after date in YYY-MM-DD format
shortcuts Boolean/Array true the shortcuts for the range picker
first-day-of-week Number 7 set the first day of week (1-7)

shortcuts

  • true - show the default shortcuts
  • false - hide the shortcuts
  • Object[] - custom shortcuts, [{text, start, end}]
Prop Type Description
text String Text
start Date Start Date
end Date End Date