Base data

      
        new Vue({
          el: '#app',
          data: {
            time: new Date(),
            range: [new Date(),new Date()],
            emptyTime: '',
            emptyRange: [],
            local: {
              dow: 0, // Sunday is the first day of the week
              hourTip: 'Select Hour', // tip of select hour
              minuteTip: 'Select Minute', // tip of select minute
              secondTip: 'Select Second', // tip of select second
              yearSuffix: '', // suffix of head year
              monthsHead: 'January_February_March_April_May_June_July_August_September_October_November_December'.split('_'), // months of head
              months: 'Jan_Feb_Mar_Apr_May_Jun_Jul_Aug_Sep_Oct_Nov_Dec'.split('_'), // months of panel
              weeks: 'Su_Mo_Tu_We_Th_Fr_Sa'.split('_') // weeks,
              cancelTip: 'cancel',
              submitTip: 'confirm'
            }
          },
          methods: {
            //disable the weekend
            disabledDate (time) {
              var day = time.getDay();
              return day === 0 || day === 6;
            }
          }
        })
      
    

Default

<vue-datepicker-local v-model="time"></vue-datepicker-local>

Year

<vue-datepicker-local v-model="time" format="YYYY"></vue-datepicker-local>

Month

<vue-datepicker-local v-model="time" format="YYYY-MM"></vue-datepicker-local>

Time

<vue-datepicker-local v-model="time" format="YYYY-MM-DD HH:mm:ss"></vue-datepicker-local>

Disabled

<vue-datepicker-local v-model="time" disabled></vue-datepicker-local>

Clearable

<vue-datepicker-local v-model="emptyTime" clearable></vue-datepicker-local>

<vue-datepicker-local v-model="emptyRange" clearable></vue-datepicker-local>

Range

<vue-datepicker-local v-model="range"></vue-datepicker-local>

Range Separator

<vue-datepicker-local v-model="range" range-separator="至"></vue-datepicker-local>

disabledDate

<vue-datepicker-local v-model="time" :disabled-date="disabledDate" ></vue-datepicker-local>

Local

<vue-datepicker-local v-model="time" :local="local"></vue-datepicker-local>

Inline Mode

<vue-datepicker-local v-model="time" type="inline"></vue-datepicker-local>

Show Buttons

<vue-datepicker-local v-model="time" @confirm="confirm" show-buttons ></vue-datepicker-local>